JavaScript原型链概念解释

124 阅读1分钟

每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针。如果让原型对象等于另一个构造函数的实例。此时的原型对象拥有一个指向另一个构造函数的内部指针,相应的,另一个原型中也包含着指向另一个构造函数的指针。假如另一个构造函数的原型又指向另一个构造函数的实例,那么上述的关系依然成立,如此层层递进,就构成了实例与原型的链条。

具体看代码:

function First() {
    this.first = 'first'
}
First.prototype.getFirst = function() {
    return this.first
}
function Second() {
    this.second = 'second'
}
Second.prototype = new First()
Second.prototype.getSecond = function() {
    return this.second
}
function C() {
}
C.prototype = new Second();
let c = new C()

console.log(c.getFirst(), c.getSecond()) 
// First Second

上述代码中每一个构造函数中都有一个原型对象,原型对象都包含一个指向构造函数的指针,如:

First.prototype === new First().__proto__ // true

同时,Second函数的原型等于First函数的实例,那么Second函数就拥有了指向First函数构造函数的内部指针

Second.prototype = new First();
Second.prototype.__proto__ === First.prototype // true

而且First函数原型也拥有指向另一个构造函数的内部指针

First.prototype.__proto__ === Object.prototype // true

同样 C函数原型也拥有指向Second函数原型构造函数的内部指针

C.prototype.__proto__ === Second.prototype // true