JavaScript继承

原型继承

    //1.原型继承:子级构造函数的原型赋值为父级构造函数的实例
    //优点：子级的实例也是父级的实例，能够访问到父级原型对象上的属性和方法
    //缺点：子级和父级公有一条原型链，如果通过某个实例修改原型对象上的属性，其他实例的原型方法也会被修改
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(){}
    Child.prototype=new Father()
    var c1=new Child()

构造继承

    //2.构造继承：在子级构造函数内部调用父级构造函数
    // 优点：子级能够访问到父级构造函数的属性和方法
    // 缺点：没有对原型链进行修改，也就无法访问原型链上的属性和方法
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(name,age){
        Father.call(this,name,age)
    }
    var c1=new Child('zhangsan',12)

组合继承

    //3.组合继承=原型继承+构造继承
    // 优点；子级实例对象既可以访问父级构造函数上的属性和方法，也可访问父级原型对象上的属性和方法
    // 缺点：父级构造函数被多次执行
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(name,age){
        Father.call(this,name,age)
    }
    Child.prototype=new Father();
    var c1=new Child('zhangsan',12)

原型式继承

    //4.原型式继承
    // 优点：与原型继承类似，不需要定义构造函数，返回一个继承obj的对象
    // 缺点：无法访问构造函数上的属性和方法
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(){}
    
    //Object.create()方法的重写
    // 作用：1.返回一个对象 2.这个对象的原型（__proto__）使我们指定的值
    function objectCreate(obj){
        function F(){}
        F.prototype=obj
        return new F()
    }
    Child.prototype=objectCreate(Father.prototype)
    // 原来的原型链为：
    // c1=>Child.prototype=>Object.prototype=>null
    // 此时原型链为：
    // c1=>Child.prototype=>Father.prototype=>Object.prototype=>null
    var c1=new Child()

寄生继承

 	//5.寄生继承
    // 优点：与原型式继承类似，但是在封装函数内部增添了一些属性和方法
    // 缺点：无法访问构造函数内部的属性和方法
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(){}
    
    // 作用：1.返回一个对象 2.这个对象的原型（__proto__）使我们指定的值 3.给新对象增添一些属性和方法
    function objectCreateAnother(obj,constructor){
        var newObj=Object.create(obj)
        newObj.constructor=constructor
        newObj.say=function(){
            console.log('say');
        }
        return newObj
    }
    Child.prototype=objectCreateAnother(Father.prototype,Child)
    // 原来的原型链为：
    // c1=>Child.prototype=>Object.prototype=>null
    // 此时原型链为：
    // c1=>Child.prototype=>Father.prototype=>Object.prototype=>null
    var c1=new Child()

寄生组合式继承

    //6.寄生组合式继承：构造继承+寄生继承
    // 优点：只调用一次父级构造函数，并且也可以访问到指定对象上的属性和方法
    //父级构造函数
    function Father(name,age){
        this.name=name
        this.age=age
    }
    //父级构造函数原型方法
    Father.prototype.say=function(){
        console.log(this.name)
        console.log(this.age);
    }
    //子级构造函数
    function Child(name,age){
        Father.call(this,name,age)
    }
    
    // 作用：1.返回一个对象 2.这个对象的原型（__proto__）使我们指定的值 3.给新对象增添一些属性和方法
    function objectCreateAnother(obj,constructor){
        var newObj=Object.create(obj)
        newObj.constructor=constructor
        newObj.say=function(){
            console.log('say');
        }
        return newObj
    }
    Child.prototype=objectCreateAnother(Father.prototype,Child)
    // 原来的原型链为：
    // c1=>Child.prototype=>Object.prototype=>null
    // 此时原型链为：
    // c1=>Child.prototype=>Father.prototype=>Object.prototype=>null
    var c1=new Child('zhangsan',12)