原型与原型链

2020-08-04  本文已影响0人  依然还是或者其他

原型

显式原型 prototype,是函数才有的属性
隐式原型proto,是对象都有的属性

无论是prototype,还是proto,都是对象。

对象的proto,对指向显式原型prototype,即构造函数的prototype

function a(){}

const ins=new a();

console.log(ins.__proto__===a.prototype);
console.log(a.prototype.constructor===a);
// true
// true

原型链

由于每个对象都有proto,而proto本身也是对象,所以追溯起来就会形成一个链条。
最后__proto__d都会指向null,因为最基础对象的是Object,而它的proto不能指向它自己,如果那样会有死循环,所以指向null。

ES5继承

function A(){
    this.a="a";
}
function B(){
    A.call(this);
    this.b="b";
}

B.prototype=new A();

var ins=new B();

console.log(ins instanceof B);
console.log(ins instanceof A);
//true
//true

ES6继承

class A{
    constructor() {
    }
}
class B extends A{
    constructor() {
        super();
    }
}
var ins=new B();

console.log(ins instanceof B);
console.log(ins instanceof A);

ES5与ES6继承区别

ES5是先创建子类的实例对象this,然后再将父类的方法添加到this上;
ES6是先将父类的实例对象添加到this上,然后再用子类的构造函数修改this,即为什么必须先调用super方法。

参考:

1.深入理解javascript原型和闭包
2.三张图搞懂JavaScript的原型对象与原型链
3.浅谈 instanceof 和 typeof 的实现原理
4.详解JS原型链与继承
5.ECMAScript 6 入门

上一篇 下一篇

猜你喜欢

热点阅读