1. 程式人生 > >我對js原型和原型鏈的理解

我對js原型和原型鏈的理解

我們知道在js中,萬物皆物件,物件可以說是重中之重了。每一個物件都擁有自己的屬性。但是在這個世界中有很多東西都是相似的,可以歸為一類,他們有共同的方法和屬性。不可能讓每一個物件都定義一個屬性吧。那樣太消耗記憶體了。所以,在js中怎麼才能讓多個物件共享一個或多個方法呢?原型的出現就是為了解決這個問題。

在js中每個物件都有一個與它關聯的物件,叫做原型物件。每一次獲取物件屬性都是一次查詢過程,當在物件的自有屬性中找不到時就會去查詢它的原型物件。

在js中函式也是一個物件。每個函式都有一個prototype屬性(只有函式才有prototype屬性),這是一個指標,指向一個物件,而這個物件的用途是包含可以由特定型別的所有例項共享的屬性和方法。按照字面意思來理解,那麼prototype就是通過呼叫建構函式而建立的那個物件例項的原型物件。其中原型物件會自動獲得一個constructor屬性,這個屬性指向prototype屬性所在的指標。如下面的Man.prototype.constructor指向Man。

function Man(name,age) {
	this.name = name;
	this.age = age;
}

function test() {
	var person1 = new Man("張三","18");
	var person2 = new Man("李四","19");
	Man.prototype.sex = "男";
	console.log(person1.sex); //男
	console.log(person2.sex); //男
}

每個男孩共有的屬性就是他的性別都是男,所以我們可以將此屬性新增到例項的原型物件中去。這樣每個例項都可以共享這個屬性。

我們前面說了每個函式都有prototype屬性,指向函式的原型物件。他的例項物件可以共享這個屬性,那我們怎麼將例項物件和原型物件關聯起來呢?在js中,任何物件都有一個屬性叫__proto__([[prototype]]),它也是一個指標,指向建構函式的原型物件,就是我們所能共享資訊的那個物件。現在我們可以畫出一幅圖,展示他們之間的關係。

我們不同的物件可能會用到不同的屬性,比如說一個物件需要一種屬性,一個物件需要另一種屬性。這時如果我們把它都定義在一個原型物件中肯定是不好的,這時我們就需要java中常說的繼承。js中實現繼承的方式是通過原型鏈。

原型鏈是什麼呢,根據字面意思我們可以這樣理解,就是將原型連成一條鏈。我們上面講過,js每一次獲取物件中的屬性都是一次查詢過程,如果在自有屬性中找不到就會去原型物件中查詢,如果原型物件中還查不到,就回去原型物件的原型中查詢,也就是按照原型鏈查詢,直到查詢到原型鏈的頂端,也就是Object的原型。

function FutherType(){
	this.property = true;
}

FutherType.prototype.getFutherValue - function(){
	return this.property;
}

function SonType(){
	this.sonproperty = false;
}

SonType.prototype = new FutherType();

SonType.prototype.getSonValue = function(){
	return this.sonproperty;
}

var instance = new SonType();
console.log(instance.getFutherValue()); //true

原型物件之間的關係如下圖:

此文是我閱讀javascript高階程式設計後,對原型和原型鏈的理解,也當作學習js的筆記。