继承的几种方法

继承：一个没有某个方法的对象使用具有这个方法的对象的方法

    对象之间的继承，类之间的继承

 

    对象继承：

        改变this的指向

// var obj = {
                //     name:"admin",
                //     show:function(){console.log(this.name)}
                // }
                // var obj2 = {name:"root"}
                // obj.show()
                // obj.show.call(obj2);
                // obj.show.apply(obj2);
                // obj.show.bind(obj2)();

new关键字

// function Fn(){
                //     this.name = "admin";
                // }
                // Fn.prototype.show = function(){
                //     console.log(this.name)
                // }
                // var f = new Fn();
                // f.show();

构造函数与构造函数之间的继承

 

1.继承-改变this的指向（构造函数继承）

    只能继承构造函数中的内容，不能继承原型上的方法

    简单，方便

    可以轻松实现多继承

function Parent(n){
        this.name = n;
        this.show = function(){
            console.log(this.name);
        }
    }
    Parent.prototype.init = function(){
        console.log("hello")
    }


    function Parent2(){
        this.abc = function(){
            console.log("abc");
        }
    }
    function Parent3(){
        this.qwe = function(){
            console.log("qwe");
        }
    }


    function Child(n){
        Parent.call(this,n);
        Parent2.call(this);
        Parent3.call(this);
        // Parent.apply(this,[n]);
        // Parent.bind(this,n)();
    }


    var p = new Parent("html");
    var c = new Child("div");


    p.show();
    p.init();
    c.show();
    // c.init();
    c.abc();
    c.qwe();

2.原型继承：原型对象继承，原型链继承

   原型对象继承

        只能继承原型对象上的方法或属性，不能继承构造函数中的方法或属性

        1.没有兼容问题

        2.不方便传参

function Parent(n){}
    Parent.prototype.name = "html";
    Parent.prototype.show = function(){
        console.log(this.name);
    }
    Parent.prototype.abc = function(){
        console.log("abc");
    }


    function Child(n){}


    // Child.prototype = Parent.prototype;
    for(var i in Parent.prototype){
        Child.prototype[i] = Parent.prototype[i];
    }


    Child.prototype.abc = function(){
        console.log("hello");
    }


    var p = new Parent();
    var c = new Child();


    p.show();
    c.show();
    p.abc();
    c.abc();

原型链继承

既能继承构造函数，又能继承原型

不方便传参

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


    function Child(){}


    Child.prototype = new Parent("div");


    // Child.prototype.show = function(){
    //     console.log("hello");
    // }


    var p = new Parent("html");
    var c = new Child();


    console.log(p);
    console.log(c);


    p.show();
    c.show();

混合继承：构造函数继承 + 原型对象（链）继承

    既能继承构造函数，又能继承原型，还方便传参

 

常用继承方法之一

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


    function Child(n){
        Parent.call(this,n);
    }
    for(var i in Parent.prototype){
        Child.prototype[i] = Parent.prototype[i];
    }
    Child.prototype.show = function(){
        console.log("hello");
    }


    var p = new Parent("html");
    var c = new Child("div");


    console.log(p);
    console.log(c);


    p.show();
    c.show();

ES6-class继承，在语法层面上实现的继承方式，好用，方便，简单

有兼容

构造函数+原型链继承

class Parent{
        constructor(n){
            this.name = n;
        }
        show(){
            console.log(this.name);
        }
    }


    class Child extends Parent{
        constructor(n){
            super(n);
        }
    }


    var p = new Parent("html");
    p.show();


    var c = new Child("div");
    c.show();


    console.log(p)
    console.log(c)