今天开始,记录自己的生活和心得,包括生活、工作、学习等等。
养成习惯从今天开始!!!
2021年8月21日
此处为js继承,这一部分是最近学习,算是懂了一些继承相关的知识,记录下来,后续继续完善。
死记硬背真不是人干的事情,多学习多理解!
function Parent(hobby) { this.hobby = hobby this.getHobby = function() { return this.hobby } this.getAge = function() { return this.age } } Parent.prototype.age = '20'
原理:子类的原型指向父类的实例
劣势:
1)不能实现super,不能传值给父类
2)来自父类原型对象的所有属性被所有实例共享
function Child() {} Child.prototype = new Parent() Child.prototype.constructor = Child let child1 = new Child() let child2 = new Child() Parent.prototype.age = '19' console.log(child1.getAge(), child2.getAge()) // 19 19 console.log(child1 instanceof Child) // true console.log(child2 instanceof Parent) // true
原理: 在子类中执行父类的构造函数并改变父类的指针指向
劣势:
1)子类不能继承父类原型链上的属性, 只能继承父类构造函数的属性
2)无法实现父类构造函数的复用
function Child(hobby) { Parent.call(this, hobby) } let child1 = new Child(['打乒乓球']) let child2 = new Child(['打篮球']) console.log(child1.getHobby(), child2.getHobby()) // ["打乒乓球"] ["打篮球"] console.log(child1 instanceof Child, child1 instanceof Parent) // true false console.log(child1.age) // undefined
原理: 在子类中执行父类的构造函数并改变父类的指针指向,并将子类的原型指向父类的实例
劣势:
1)调用了两次父类构造函数,生成了两份实例
2)每创建一个子类的实例时候,父类都要被new一次,占内存
Child.prototype = new Parent() Child.prototype.constructor = Child let child1 = new Child(['打乒乓球']) let child2 = new Child(['打篮球']) console.log(child1.getHobby(), child2.getHobby()) // ["打乒乓球"] ["打篮球"] console.log(child1 instanceof Child, child1 instanceof Parent) // true true console.log(child1.age) // 20
原理: 在子类中执行父类的构造函数并改变父类的指针指向,并将子类的原型指向父类的原型
劣势:
1)在子类的原型上增加属性,会影响到父类的原型
Child.prototype = Parent.prototype Child.prototype.constructor = Child let child1 = new Child(['打乒乓球']) let child2 = new Child(['打篮球']) console.log(child1.getHobby(), child2.getHobby()) // ["打乒乓球"] ["打篮球"] console.log(child1 instanceof Child, child1 instanceof Parent) // true true console.log(child1.age) // 20 Child.prototype.school = '衡阳一中' console.log((new Parent).school) // 衡阳一中
原理: 在子类中执行父类的构造函数并改变父类的指针指向,并将子类的原型指向父类的拷贝原型上
重点Child.prototype = Object.create(Parent.prototype)
Child.prototype = Object.create(Parent.prototype) Child.prototype.constructor = Child let child1 = new Child(['打乒乓球']) let child2 = new Child(['打篮球']) console.log(child1.getHobby(), child2.getHobby()) // ["打乒乓球"] ["打篮球"] console.log(child1 instanceof Child, child1 instanceof Parent) // true true console.log(child1.age) // 20 Parent.prototype.name = '李斯' console.log(child1.name, child2.name) Child.prototype.school = '衡阳一中' console.log((new Parent).school) // undefined
class Parent { constructor(name) { this.name = name } getName() { return this.name } } class Child extends Parent { constructor(name, age) { super(name) this.age = age } getAge() { return this.age } } let child1 = new Child('张三', 19) console.log(child1.getName(), child1.getAge()) // 张三 19 console.log(child1 instanceof Parent) // true let child2 = new Child('张四', 16) console.log(child2.getName(), child2.getAge()) // 张四 16