Js 原型和原型鏈

Js中經過原型和原型鏈實現了繼承

Js對象屬性的訪問，首先會查找自身是否擁有這個屬性

若是查到，則返回屬性值，若是找不到，就會遍歷原型鏈，一層一層的查找，若是找到就會返回屬性值

直到遍歷完Object.prototype尚未找到，則返回undefined

 

對象中有：__proto__(原型)，函數也是對象，因此也有__proto__

構造函數中有：prototype對象，默認有一個叫作constructor的屬性，指向這個構造函數自己。

 

對象的__proto__(原型)引用了建立這個對象的構造函數的prototype對象

 1 function Baz() {}
 2 
 3 Baz.prototype.sayAge = function() {
 4     console.log(this.age);
 5 }
 6 
 7 function Bar() {
 8     this.name = 'Gary';
 9     this.age = 20;
10 }
11 
12 Bar.prototype = Object.create(Baz.prototype);
13 Bar.prototype.constructor = Bar;
14 Bar.prototype.sayName = function() {
15     console.log(this.name)
16 }
17 
18 var obj = new Bar();
19 
20 console.log(obj.sayAge()); //20

分析：

obj對象由Bar構造函數建立，因此obj對象的__proto__(原型)指向Bar.prototype

在Bar.prototype中使用object.create()，使得Bar.prototype的__proto__指向了Baz.prototype

Baz.prototype是一個對象，由構造函數Object建立，因此Baz.prototype的__proto__指向了Object.prototype

特殊的：最後Object.peototype的__proto__指向null

 

由此構成的一條原型鏈：obj -> Bar.prototype -> Baz.prototype -> Object.prototype -> null

根據開頭的對象屬性查找規則，obj調用sayAge打印出了20

 

幾個原型指向：

function fn(){...}  ===>>> var fn = new Function(...)

因此函數的__proto__指向Function.prototype

同理：

function Object(){} ===>>> var obj = new Object()

function Function(){} ===>>> var fn = new Function()

構造函數的__proto__指向Function.prototype