JS 原型（prototype）詳解

首先來看一段**：

function c() 
function f()

在js中"function" 關鍵字有兩個含義，既可以把它當作乙個普通函式關鍵字，也可以把它當作類的建構函式（即定義類）關鍵字。

上面定義的兩個函式，不管你是想定義乙個類的建構函式還是就定義乙個普通函式。它們都包含乙個prototype和constructor屬性。

prototype屬性指向了乙個物件，這個物件即是原型物件。這就是js中的原型概念。很簡單把？

constructor屬性指向該函式的建構函式。函式的建構函式？在這裡有必要把函式的建構函式講一下。既然每個函式都包含prototype和constructor,其實就可以把函式"c", "f"當作乙個物件，其實瀏覽器也就這麼幹的。當我們列印出來typeof c 的型別時會顯示是fucntion, 懂點js物件就會有疑問。既然是物件，那麼為什麼列印出來的不是object。其實可以這樣理解，js中物件有兩個概念，乙個是function型別物件，乙個object型別的物件。

下面來看一下自定義函式的建構函式是什麼：

console.log(c.constructor);

上面執行的結果是：function function()

從這個小實驗可以得出乙個結論：所有通過function關鍵字定義的函式物件都是fucntion這個函式構造出來的。

上面大多是在講函式，函式的建構函式，函式物件的概念。

1、每個函式都有乙個prototype屬性，指向該函式的原型物件。原型物件預設是乙個「{}」空物件。

2、每個物件都有乙個__proto__屬性，指向構造它的函式的原型物件。它和它的建構函式的prototype屬性指向的是同乙個物件，即c.prototype == new c().__proto__

3、所有物件

都有乙個__proto__屬性，它們都指向構造它的函式的原型物件。只有object的原型物件為null。

4、每個原型物件都乙個constructor和__proto__屬性。c == c.prototype.constructor == new c().__proto__.constructor。__proto__屬性指向了該原型物件的建構函式的原型物件（即原型物件的原型物件），通過這個屬性就構成了乙個原型鏈。

5、原型物件的原型物件的原型物件....構成了乙個原型鏈，每個自定義函式的原型物件的__proto__屬性指向object的原型物件，object的原型物件為null。

6、通過原型鏈就實現了繼承。當呼叫乙個物件的方法或屬性時它首先會在本物件找，然後在原型物件找，再往原型物件的原型物件找，直到最後乙個null，這也就是為什麼，每個自定義的物件都可以呼叫object物件的方法，它的內部機制就是原型鏈。

3、每個函式的原型物件的型別都是object型別，除了自定義函式的建構函式(

c.constructor)。

4、每個物件都有乙個

constructor屬性，指向它的建構函式。

c == new c().constructor

原型物件運用的小例子：

1.同乙個建構函式建立的物件共享同乙個原型物件。

function c() 
c.prototype.name = 'zz';
c.prototype.f = function() 
var c1 = new c();
var c2 = new c();
console.log(c1.name + "==" + c2.name);
c1.f();
c2.f();

2、通過原型物件實現繼承

function f() 
f.prototype.ff = function()
function c() 
c.prototype = new f(); //繼承f物件的屬性和方法
var c1 = new c();
console.log(c1.name);
c1.ff();

3、共享原型鏈中的方法和屬性

function c() 
object.prototype.f = function() ;
object.prototype.name = 'object';
var c1 = new c();
c1.f();
console.log(c1.name);

JS 原型（prototype）詳解

js中的原型prototype

js 原型（prototype 繼承相關2

理解js的 prototype原型物件

JS 原型（prototype）詳解

js中的原型prototype

js 原型（prototype 繼承相關2

理解js的 prototype原型物件

相關推薦