js继承，原型链继承，构造函数继承，组合式继承，原型式继承，寄生式继承，组合寄生式继承，extends继承

本文主要是介绍js继承，原型链继承，构造函数继承，组合式继承，原型式继承，寄生式继承，组合寄生式继承，extends继承，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

继承的理解，复用父类的属性和方法并增加新的属性和方法

目录

1. 原型链继承：

2. 构造函数继承

3. 组合式继承

4. 原型式继承

 5. 寄生式继承

6. 组合寄生式继承

7. extends继承

---

1. 原型链继承：

父类构造函数的实例赋值给子类原型

 function Parent(age){this.age=agethis.color=['green']}function Child(){}Child.prototype=new Parent()let child = new Child()let child1 = new Child()child.color.push('red')console.log(child.color,child1.color)//两个输出都是['green', 'red']

2. 构造函数继承

子类通过call调用父类的构造函数，解决原型链继承的两个问题，其一是共享父类引用类型的属性，其二是子类不能向父类传参

但是带来问题是每创建一个实例都会执行一次父类构造函数，相当于把父类的实例属性复制给子类

不能复用，并且不能继承原型链上属性和方法

function Parent(age){this.age=agethis.color=['green']}function Child(age){
Parent.call(this,age)}Child.prototype=new Parent()let child = new Child()let child1 = new Child()child.color.push('red')console.log(child.color,child1.color)//第一个输出是['green', 'red']，第二个输出是green

3. 组合式继承

结合构造函数继承来 继承实例属性和方法，利用 原型链继承 继承原型链属性和方法

function Parent(age) {this.age = age;this.color = ['green'];}function Son(age) {Parent.call(this, age); // 借用构造函数继承实例属性}// 使用 Object.create 优化原型链继承Son.prototype = new Parent()Son.prototype.constructor = Son;// 进一步添加原型方法，以验证继承效果Parent.prototype.sayAge = function () {console.log(this.age);};Son.prototype.sayHello = function () {console.log('Hello');};// 测试代码let son1 = new Son(10);let son2 = new Son(20);son1.color.push('red');console.log(son1.color); // ['green', 'red']console.log(son2.color); // ['green']son1.sayAge(); // 10son2.sayAge(); // 20son1.sayHello(); // Helloson2.sayHello(); // Hello

4. 原型式继承

利用es5里的object.create，就是 通过已有对象创建新对象，让新对象原型链指向已有对象

通过已有的对象作为新对象的原型，生成一个新的对象实例

选择性修改新对象属性

他的缺点和原型链继承一样

let person = {firstname:'John',
lastname:'foe',
fullname:function(){
return this.firstname+""+this.lastname
}}let person1 = Object.create(person)
let person2 = Object.create(person)//已有对象生成新对象，已有对象作为新对象的原型生成新实例
//person1和person2都是创建出来的实例
person1.firstname='Jane'
console.log(person1.fullname())//jane foe
console.log(person2.fullname())//john foe//体现缺点的代码：let person={firstname:'li',lastname:['green'],fullname:function(){return this.firstname+""+this.lastname}}let person1 = Object.create(person)let person2 = Object.create(person)person1.lastname.push('red')console.log(person1.fullname(),person2.fullname())//ligreen,red ligreen,red

模拟object.create:

function objectfactory(o){function F(){}
F.prototype=o
return new F()
}

 5. 寄生式继承

可以添加新的属性和方法， 使用现有对象作为原型创建一个新对象，增强这个对象，添加新属性或方法，返回这个对象

同样难以重用

let person={firstname:'li',lastname:['green'],fullname:function(){return this.firstname+""+this.lastname}}function jisheng(o){let clone=Object.create(o)clone.newfunc=function(){console.log('haha')}return clone//千万别忘了返回值}let child1 = jisheng(person)let child2 = jisheng(person)console.log(child1.newfunc(),child2.newfunc())

6. 组合寄生式继承

优化了组合继承中需要 父类构造函数被调用两次，一次在创建子类原型，一次在子类构造函数

基于object.create

接受两个参数，子类构造函数和父类构造函数
第一步创建父类原型的副本
然后 返回的p对象设置constructor属性，解决由于重写原型导致默认constructor丢失的问题，最后将新创建的对象赋值给子类型的原型

function inherit(subtype,supertype){let p = Object.create(supertype)
p.constructor=subtype
subtype.prototype=p}

原型式继承，寄生继承和寄生组合都使用object.create

7. extends继承

利用es6类和构造函数实现继承

class Parent{constructor(age){
this.age=age
}
s(){console.log('hello')}}class Son extends Parent{t(){
console.log('you')
}}let son1 = new Son(30)
son1.s()
son1.t()

这篇关于js继承，原型链继承，构造函数继承，组合式继承，原型式继承，寄生式继承，组合寄生式继承，extends继承的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---