首页 > Web开发 > 详细

02 js原型链

时间:2019-09-09 22:05:24      阅读:98      评论:0      收藏:0      [点我收藏+]

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

02 js原型链

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

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!