02 js原型链

1 js原型链是一个绕不开的话题。直接上说吧。

/**
 * 1. js里的原型链是怎么样的? 带class 和不带class的原型链的不同。
 */

 const  util = require('util');
 function A() {
    console.info("I am A ");
 }

 function B() {
    console.info("I am B ");
}
    
function C() {
    console.info("I am C ");
}

util.inherits(B, A);
util.inherits(C, B);
class  CA {
    constructor(){
        console.info("i am CA");
    }

    doCA(){
        console.info(" doCA ");
    }
}

class  CB extends CA{
    constructor(){
        super();
        console.info("i am CB");
    }

    doCB(){
        console.info(" do CB ");
    }
}

class  CC extends CB {
    constructor(){
        super();
        console.info("i am CC");
    }

    doCC(){
        console.info(" i am doCC");
    }
}

//原型链继承如下:
var c = new C();
console.info( c.__proto__ === C.prototype);
console.info(c.__proto__.__proto__ === B.prototype);
console.info(c.__proto__.__proto__.__proto__ === A.prototype);
console.info(c.__proto__.__proto__.__proto__.__proto__ === Object.prototype);
console.info(c.__proto__.__proto__.__proto__.__proto__.__proto__ === null);

//class
var cc = new CC();
console.info(cc.__proto__ === CC.prototype);
console.info(cc.__proto__.__proto__ === CB.prototype);
console.info(cc.__proto__.__proto__.__proto__ === CA.prototype);
console.info(cc.__proto__.__proto__.__proto__.__proto__ === Object.prototype);
console.info(cc.__proto__.__proto__.__proto__.__proto__.__proto__ === null);

//下面是类的继承关系。class和非class是不同的
console.info("类继承关系");
console.info(C.prototype.constructor === C);//C的原型的构造 = 本身
console.info(C.__proto__ === Function.prototype);//所有的类的__proto__指向Function的原型,即构造主的原型。
console.info(Function.__proto__ === Function.prototype);//

console.info("带class的类继承关系");
console.info(CC.__proto__ === CB);//带class 的CC的__proto__指向,cb, 最终最想 Function的原型。
console.info(CC.__proto__.__proto__ === CA);
console.info(CA.__proto__ === Function.prototype);

原型链要记住一下几点:

1. 每个东西都有 __proto__

2. 类的prototype = 类的原型。 类的原型的 construct = 类。

3. 小c的__proto__ = C的原型,C的原型的__proto__= B的原型, B的原型的__proto__ = A的原型 , A的原型的 __proto__ = Object的原型,Object的原型的__proto__ = null;这就是原型链,很简单吧。

4. 用class 继承时, CC的__proto__ = CB, CB的__proto__ = CA, CA的__proto__ = Function的原型。

用util.inherits 实现继承时, C,B,A, Function的__proto__ 都等于 Function的原型。

只要把上面都记住,多练习,就可以很好的掌握原型链。

以上如果还没有看懂的话,可以参考:https://blog.csdn.net/m0_37589327/article/details/78655038

原文地址:https://www.cnblogs.com/gongzhuiau/p/11494230.html