js实现继承的方式

function Person() {
    this.name = 'aaa'
    this.info = {
        sex: 'boy',
        hobby: 'basket'
    }
    this.say = function () {
        console.log(111)
    }
}
Person.prototype.sing = function () {
    console.log(this.name)
}

1、原型链继承

function Child() {
    this.age = '18'
}
Child.prototype = new Person() // => Child.prototype.__proto__ = Person.prototype (核心)
console.log(Child.prototype)
const child1 = new Child()
child1.info.sex = 'women' // 指向得是同一个地址，这是Child得属性，修改后则其他同类也会获取到改变后得值（缺点）
console.log(child1.name)
child1.name = 'zs' // 简单类型，所以该操作为给自己添加属性，这是存在child1自己身上得数据
console.log(child1)
const child2 = new Child()
console.log(child2.info.sex)  // women
console.log(child2)  // aaa (去的Child上得数据)

/*
重点：让新实例的原型等于父类的实例。
特点：1、实例可继承的属性有：实例的构造函数的属性，父类构造函数属性，父类原型的属性。（新实例不会继承父类实例的属性！）

缺点：1、新实例无法向父类构造函数传参。
　　　2、继承单一。
　　　3、所有新实例都会共享父类实例的属性。（原型上的属性是共享的，一个实例修改了原型属性，另一个实例的原型属性也会被修改！）
* */

2、构造函数继承

function Child(params) {
    Person.call(this, params) //核心
    this.parent = 'ls'
}
const child1 = new Child()
console.log(child1) // 没有原型链上没有sing方法
/*
重点：用.call()和.apply()将父类构造函数引入子类函数（在子类函数中做了父类函数的自执行（复制））

特点：1、只继承了父类构造函数的属性，没有继承父类原型的属性。
　　　2、解决了原型链继承缺点1、2、3。
　　　3、可以继承多个构造函数属性（call多个）。
　　　4、在子实例中可向父实例传参。

缺点：1、只能继承父类构造函数的属性。
　　　2、无法实现构造函数的复用。（每次用每次都要重新调用）
　　　3、每个新实例都有父类构造函数的副本，臃肿。
* */

3、组合式继承

const Child = function (params) {
    Person.call(this, params)
    this.parent = params
}
Child.prototype = new Person()
const child1 = new Child('li')
const child2 = new Child('ww')
console.log(child1)
console.log(child2)

/*
重点：结合了两种模式的优点，传参和复用
特点：1、可以继承父类原型上的属性，可以传参，可复用。
　　　2、每个新实例引入的构造函数属性是私有的。
缺点：调用了两次父类构造函数（耗内存），子类的构造函数会代替原型上的那个父类构造函数。

* */

4、原型式继承

function CreateObj(o){
    function F(){}
    F.prototype = o;
    // console.log(o.__proto__ === Object.prototype);
    // console.log(F.prototype.constructor === Object); // true
    return new F();
}

const person = {
    name: 'xiaopao',
    friend: ['daisy','kelly'],
    info: {
        ccc: 'ccc'
    }
}

let person1 = CreateObj(person);

// var person2 = CreateObj(person);

person1.name = 'person1';

// console.log(person2.name); // xiaopao
person1.friend.push('taylor');

// console.log(person2.friend); // ["daisy", "kelly", "taylor"]
// console.log(person); // {name: "xiaopao", friend: Array(3)}
person1.friend = ['lulu'];
person1.info.ccc = 'dddd'
console.log(person1);
console.log(person1.friend); // ["lulu"]
console.log(person.friend); //  ["daisy", "kelly", "taylor"]

/*
重点：用一个函数包装一个对象，然后返回这个函数的调用，这个函数就变成了个可以随意增添属性的实例或对象。object.create()就是这个原理。
优点：类似于复制一个对象，用函数来包装。
缺点：1、所有实例都会继承原型上的属性。
　　　2、无法实现复用。（新实例属性都是后面添加的)
*/

5、寄生式继承

const ob = {name:"小明",friends:['小花','小白']};
function object(o){
    function F(){}//创建一个构造函数F
    F.prototype = o;
    return new F();
}

//上面再ECMAScript5 有了一新的规范写法，Object.create(ob) 效果是一样的

function createOb(o){
    const newob = object(o);//创建对象
    newob.sayName = function(){//增强对象
        console.log(this.name);
    }

    return newob;//指定对象
}

const ob1 = createOb(ob);
console.log(ob1)
ob1.sayName();//小明
/*
重点：就是给原型式继承外面套了个壳子。
优点：没有创建自定义类型，因为只是套了个壳子返回对象（这个），这个函数顺理成章就成了创建的新对象。
缺点：没用到原型，无法复用。
* */

6、寄生组合式继承 （最好用的）

//寄生继承 创建一个新的对象返回一个新实例
function object(o){
    function F(){}
    F.prototype = o;
    return new F();
}
//父层，超级层
function Father(name){
    this.name = name;
    this.friends= ["小花","小草"];
}
Father.prototype.sayname = function(){
    console.log(this.name);
}
function Child(name,age){
    Father.call(this,name);//继承属性
    this.age = age;
}

//继承父层的prototype
function inheritPrototype(child,father){
    var prototype = object(father.prototype);//返回一个新实例（对象）
    prototype.constructor = child;//增强对象
    child.prototype = prototype;
}
inheritPrototype(Child,Father);//继承父层的原型
Child.prototype.sayage = function(){
    console.log(this.age);
}

var c1 = new Child("小白",20);
c1.friends.push("小小");
c1.sayname();//小白
c1.sayage();//20

var c2 = new Child("小蓝",23);
c2.sayname();//小蓝
c2.sayage();//23

console.log(c2.friends);//"小花","小草"
//重点：修复了组合继承的问题

7、class类继承

class Parent5 {
    constructor() {
        this.name = ['super5']
    }
    reName() {
        this.name.push('new 5')
    }
}
class Child5 extends Parent5 {
    constructor() {
        super()
    }
}
const child51 = new Child5()
const child52 = new Child5()
console.log(child51)
console.log(child52)