js的继承

1.原型链继承：使子类构造函数的prototype为父类构造函数的实例对象。
缺点：1.无法传参；
2.如果存在引用类型，该值会被所有实例所共享，修改则会影响其他实例；

优点：实现简单

function Parent(){
	this.name = 'xiaoming';
	this.age = 10;
	this.color = ['red','yello'];
};
Parent.prototype.say = function(){
	console.log(`my name is ${this.name},i'm ${this.age} years old`);
};

//子类构造函数
function Son(){
	this.sex = 'F';
};
Son.prototype = new Parent();
Son.prototype.constructor = Son;
//创建对象实例
const son1 = new Son();
const son2 = new Son();
son1.color.push(' purple');

console.log(son1,son2);

结果：

2.构造函数继承：在子类构造函数中通过call/apply调用父类构造函数。
缺点：1.无法继承父类构造函数原型上的方法和属性；

优点：1.解决啦原型链继承不能传参的问题;
2.解决啦引用类型互相影响的问题。

function Parent(name,age){
    this.name = name;
    this.age = age;
    this.color = ['red','yellow'];
};

Parent.prototype.say = function() {
    console.log(`my name is ${this.name},i'm ${this.age} years old`);
};

function Son(sex,name,age) {
    this.sex = sex;
    Parent.call(this,name,age);
};

const son1 = new Son('F','rose',18);
const son2 = new Son('M','mark',19);

son1.color.push('purple');

console.log(son1,son2);

结果：

3.组合继承：结合原型链继承和构造函数继承。
缺点：无论什么情况，都会调用两次父类构造函数，造成不必要的性能开销。
优点：1.解决啦原型链继承不能传参的问题；
2.解决啦引用属性互相影响的问题；

function Parent(name,age) {
    this.name = name;
    this.age = age;
    this.color = ['red','yellow'];
};
Parent.prototype.say = function() {
     console.log(`my name is ${this.name},i'm ${this.age} years old`);
};

function Son(sex,name,age) {
    this.sex = sex;
    //继承父类构造函数中的实例属性和方法
    Parent.call(this,name,age);
};
//继承父类构造函数原型上的属性和方法
Son.prototype = new Parent();

const son1 = new Son('F','rose',18);
const son2 = new Son('M','mark',19);

son1.color.push('purple');
console.log(son1,son2);

结果：

4.原型式继承：通过Object.create()将父类的实例对象赋值给实例。
缺点：1.无法传参；
2.引用类型会互相影响；
3.无法实现复用
优点：无需创建子类构造函数；

function Parent(){
    this.name = 'test';
    this.color = ['red','yellow'];
};

Parent.prototype.say = function() {
    console.log(this.name);
};

let Child = new Parent();

const child1 = Object.create(Child);
const child2 = Object.create(Child);

child1.color.push('purple');

console.log(child1,child2);

结果：

5.寄生式继承：其实就是给原型式加拉一层外壳。

function createObj(obj) {
    const child = Object.create(obj);
    child.sayName = function(){
        console.log(this.name);
    }
    return child;
}

function Parent(){
    this.name = 'test';
    this.color = ['red','yellow'];
};

Parent.prototype.say = function() {
    console.log(this.name);
};
let obj = new Parent();
const child1 = createObj(obj);
const child2 = createObj(obj);

child1.color.push('purple');

console.log(child1,child2);

结果：

6.寄生组合式继承：是原型链继承+构造函数继承+原型式继承的结合。
缺点：实现步骤略复杂
优点：解决啦组合继承调用两次父类构造函数的问题

function Parent(name,age){
    this.name = name;
    this.age = age;
    this.color = ['red','yellow'];
};

Parent.prototype.say = function() {
    console.log(`my name is ${this.name},i'm ${this.age} years old`);
};
//创建一个父类构造函数原型对象
const prototypeObj = Object.create(Parent.prototype);

//创建子类构造函数
function Child(sex,name,age){
    this.sex = sex;
    //继承父类的实例属性和方法
    Parent.call(this,name,age);
};
//继承父类构造函数原型上的属性和方法
Child.prototype = prototypeObj;
Child.prototype.constructor = Child;

const child1 = new Child('F','rose',18);
const child2 = new Child('M','mark',19);

child1.color.push('purple');
console.log(child1,child2);

结果：

额外补充Object.create():

Object.create()用于创建一个新的对象，使用现有的对象来创建新对象的__proto__,被创建的对象会继承另一个对象的原型。
使用方法：Object.create(proto,propertiesObject);
proto，{object}，新对象要继承的对象/要继承对象的原型。
propertiesObject，{object}，可选参数，为新创建对象指定的属性对象。

详细可参考链接：https://blog.csdn.net/muzidigbig/article/details/89179459