No 009 在JavaScript中建立物件

6. 混合使用建構函式和原型

（以下所有內容僅用以記錄學習過程中的個人理解，如有錯誤歡迎指出）

如下，直接建立乙個「18歲的女孩愛麗絲」物件：

var person =
};

該方法和字面量建立有著一樣的缺點：

只能建立一次，創造多個的話會造成物件**冗餘。

var person =
newobject()
;//使用new+object建立物件
person.name =
"alice"
;person.age =18;
person.gender =
"female"
;person.
sayname
=function()

為了解決字面量建立和new + object可能的物件**冗餘問題，可以使用工廠模式來建立物件。

function
createperson
(name,age,gender)
return obj;
}var person1 =
createperson
('alice',18
,'female');
var person2 =
createperson
('tom',20
,'male'
);

雖然工廠模式解決了物件**冗餘，但沒有解決物件識別的問題。

建構函式的執行過程：

建立乙個新物件；

將建構函式的作用域賦給新物件，即把this指向這個新物件；

逐行執行**；

將新建物件作為返回值返回。

function
person
(name,age,gender)
}var person1 =
newperson
('alice',18
,'female');
var person2 =
newperson
('tom',20
,'male');
//alice和tom都是person的例項

建構函式模式與工廠模式的區別在於：

沒有顯示建立物件；

直接將屬性和方法賦值給this；

沒有return語句。

我們將建構函式稱作乙個類，用其建立的物件稱作該類的例項，作為同一類物件。

建構函式模式雖然解決了物件**冗餘和物件識別的問題，但隨著每次建立物件，建構函式中的方法也會重新建立，造成方法**汙染問題。

解析器會往建立的每乙個函式中新增乙個prototype屬性，該屬性指向乙個原型物件，該物件中包含了某一類的所有例項共享的屬性和方法。

function
person()
person.prototype.name =
"alice"
;person.prototype.age =18;
person.prototype.gender =
"female"
;person.prototype.
sayname
=function()
var person1 =
newperson()
;person1.
sayname()
;//alice
var person2 =
newperson()
;person2.
sayname()
;//alice

作為原型物件，它們都有乙個constructor屬性，指向prototype屬性所在的函式，如：

alert
(person.prototype.constructor == person)
;//true

下圖展示了類、例項、原型三者之間的關係：

如果要通過物件去訪問它的原型物件，可以通過使用隱含屬性__proto__，即上圖中物件例項的[prototype]：

function
person()
var person1 =
newperson()
;alert
(person1.__proto__ == person.prototype)
;//true

可知，如果例項和原型物件有相同的屬性/方法，那麼例項中的屬性/方法會覆蓋掉原型物件中對應的屬性/方法。同理，當為例項新增乙個屬性/方法時，該屬性就會遮蔽掉原型物件中的同名屬性/方法。

//person類同上
var person1 =
newperson()
;person1.
sayname()
;//alice
var person2 =
newperson()
;person2.name =
"tom"
; person2.
sayname()
;//tom

為了減(tou)少(lan)重複輸入person.prototype，可以用乙個包含所有屬性/方法的物件字面量來重寫整個原型物件，但有一點，constructor屬性不再指向person，所以需要主動設定。

function
person()
person.prototype =
}

但如果僅僅使用原型模式的話，會導致所有例項都共享相同的屬性，會造成例項混亂。

為了防止出現例項混亂，一般建立物件時，我們會混合使用建構函式模式和原型模式。

建構函式模式用來定義例項的屬性，原型模式用於定義方法和共享屬性。

這樣能夠最大限度地節省記憶體。

function
person
(name, age, gender)
person.prototype =
}var person1 =
newperson
("alice",18
,"female");
var person2 =
newperson
("tom",20
,"male"
);

JavaScript中對DOM操作

1 element，元素 2 attribute，屬性 3 text，文字 var node1 document.createelement div var node2 document.createtextnode hello world 返回當前文件中第乙個類名為 myclass 的元素 var...

javascript中對cookie的訪問查操作

瀏覽器向伺服器請求得到響應後就與伺服器斷開連線那麼伺服器該如何記住某個使用者呢比如你登陸乙個在站內跳轉到另乙個板塊後伺服器怎麼確認你是剛才已經登陸的那個使用者呢這裡就要用到cookie,乙個可以讓瀏覽器儲存使用者資訊的功能 cookie都是以 name value 這種成對形式儲存所有...

在iPhone中建立模態 modal 等待對話方塊

因為mvc架構，我們自己通過view去建立自己的模態 modal 等待對話方塊，比較難實現。乙個比較可行的方法就是通過uialertview來實現。警告框，正好符合模態的要求。1 建立乙個警告框 waitingdialog uialertview alloc initwithtitle nil me...

No 009 在JavaScript中建立物件

JavaScript中對DOM操作

javascript中對cookie的訪問查操作

在iPhone中建立模態 modal 等待對話方塊

相關推薦