JS继承

• 概念

  • 通过【某种方式】让一个对象可以访问到另一个对象中的属性和方法，我们把这种方式称之为继承 并不是所谓的xxx extends yyy
  • 有些对象会有方法(动作、行为)，而这些方法都是函数，如果把这些方法和函数都放在构造函数中声明就会导致内存的浪费

• 继承的第一种方式：原型链方法继承

    var Person = function(){
        
    };
    Person.prototype.say=function(){
        console.log("你好")
    }
    var sunny = new Person();
    console.log(sunny.say());

• 继承的第二种方式：原型链继承

    // 一般情况下，应该先改变原型对象，再创建对象;
    // 一般情况下，对于新原型，会添加一个constructor属性，从而不破坏原有的原型对象的结构;
    var Person = function(){};
    Person.prototype = {
        //切记不能忘记
        constructor:Person,
        say:function(){
            console.log("你好");
        },
        run:function(){
            console.log("正在进行百米冲刺");
        }
    }
    var sunny = new Person;
    sunny.say();
    console.log(Person.prototype.constructor === Person);

• 继承的第三种方式：拷贝继承(混入继承：mixin)

    // 由于拷贝继承在实际开发中使用场景非常多，所以很多库都对此有了实现
    // jquery：$.extend
    var Person = {
        hear: 'black',
        skin: 'yellow',
        eye: 'brown',
    }
    var extend = function (source){
        let target = {};
        for(let key in source){
            target[key] = source[key];
        }
        return target;
    }
    var sunny = extend(Person);
    sunny.hear = 'white';
    console.log(sunny);

    // es6中有了 <对象扩展运算符> 仿佛就是专门为了拷贝继承而生
    var Person = {
        hear: 'black',
        skin: 'yellow',
        eye: 'brown',
    }
    var target = {...Person}; 
    console.log(target);

• 继承的第四种方式：原型继承 (道格拉斯在蝴蝶书中提出来的)

    var Person = {
        hear: 'black',
        skin: 'yellow',
        eye: 'brown',
    }
    var sunny = Object.create(Person);
    console.log(sunny.__proto__);

• 继承的第五种方式：借用构造函数实现继承

    var Animal = function(name, age){
        this.name = name;
        this.age = age;
    }
    var Person = function(name, age, address){
        Animal.call(this, name, age);
        this.address = address;
        return this.age;
    }
    console.log(Person('dog', '18', '不告诉你！'));