细说javascript中的那些继承问题~

JS中的继承

1.原型继承:子类的原型指向父类的一个实例,父类的公有和私有都是子类的公有方法。

B的原型继承了a这个实例的的所有属性,把a这个实例的公有和私有属性都继承过来了。

funcition A () {
    this.x = 100;
}
A.prototype.getX = function () {
    console.log(this.x);
}
function B () {}
var a = new A();//new 一个A的实例a
B.prototype = a;//原型继承的核心代码
B.prototype.constructor = B;
var b = new B();
console.dir(b);

2.call继承,在子类的构造函数中,C.call(this);父类.call(this);把父类的私有方法继承到子类的私有方法

function C () {
    this.x = 100; //this.x=100 => d.x=100;给d添加了一个x的私有属性,属性值是100
}
C.prototype.getX = function () {
    console.log(this.x);
}
function D () {
    //this可以理解为d,因为d是D的一个实例
    C.call(this);//call继承的核心代码,把C类函数中的this修改成D的实例d
}
var c = new C();
var d = new D();
console.dir(d);

3.冒充对象继承,在子类的构造函数中遍历父类的实例。E是冒充的对象,把父类的公有和私有方法继承为子类的私有

function E () {
    this.x = 100;
}
E.prototype.getX = function () {
    console.log(this.x);
}
function F () {
    var e = new E();
    for (var key in e) {//核心代码
        //key: x,getX
        //if (e.hasOwnProperty(key)) {} //可以把getX这个公有属性过滤掉
        this[key] = e[key];
        //f.x = e.x => f.x = 100;
        //f.getX = e.getX => f.getX = E.prototype.getX
    }
}
var f = new F();
console.log(f);
console.log(f.getX === E.prototype.getX);

4.组合继承 原型+call 无论是私有还是公有全都能继承到,原来的私有的现在仍然是通过call继承是私有,原来是公有的通过原型继承仍然是公有的

function G () {
    this.x = 100;
}
G.prototype.getX = function () {
    console.log(this.x);
}
function H () {
    G.call(this);
}
H.prototype = new G();
H.prototype.constructor = H;

5.中间件继承,让子类的原型__proto__属性,本来应该指向Object.prototype;现在指向父类的原型,父类的共有属性编程子类的公有属性

function J () {
    this.x = 100;
}
J.prototype.getX = function () {
    console.log(this.x);
}
function K () {}
K.prototype.__proto__ = J.prototype;
console.dir(K);

计生组合式继承

function M () {}
function N () {}
N.prototype = Object.create(M.prototype);

你可能感兴趣的:(javascript继承)