對(duì)象：javascript中的對(duì)象就是屬性和方法的集合刃泡。
一虑省、生成實(shí)例對(duì)象的原始模式
假定我們把貓看成一個(gè)對(duì)象忧饭，它有"名字"和"顏色"兩個(gè)屬性曼玩。
<pre>
var Cat = {
name: '',
color: ''
}
</pre>
現(xiàn)在鳞骤，我們需要根據(jù)這個(gè)原型對(duì)象的規(guī)格（schema），生成兩個(gè)實(shí)例對(duì)象黍判。
<pre>
var cat1 = {}; // 創(chuàng)建一個(gè)空對(duì)象
cat1.name = "大毛"; // 按照原型對(duì)象的屬性賦值
cat1.color = "黃色";
var cat2 = {};
cat2.name = "二毛";
cat2.color = "黑色";
</pre>
好了豫尽，這就是最簡(jiǎn)單的封裝了，把兩個(gè)屬性封裝在一個(gè)對(duì)象里面顷帖。但是美旧，這樣的寫法有兩個(gè)缺點(diǎn)，一是如果多生成幾個(gè)實(shí)例贬墩，寫起來(lái)就非常麻煩榴嗅；二是實(shí)例與原型之間，沒(méi)有任何辦法震糖，可以看出有什么聯(lián)系。
二趴腋、原始模式的改進(jìn)
我們可以寫一個(gè)函數(shù)吊说，解決代碼重復(fù)的問(wèn)題。
<pre>
function Cat(name,color) {
return {
name:name,
color:color
}
}
</pre>
然后生成實(shí)例對(duì)象优炬，就等于是在調(diào)用函數(shù)：
<pre>
var cat1 = Cat("大毛","黃色");
var cat2 = Cat("二毛","黑色");
</pre>
這種方法的問(wèn)題依然是颁井，<code>cat1</code>和<code>cat2</code>之間沒(méi)有內(nèi)在的聯(lián)系，不能反映出它們是同一個(gè)原型對(duì)象的實(shí)例蠢护。
三雅宾、構(gòu)造函數(shù)模式
為了解決從原型對(duì)象生成實(shí)例的問(wèn)題，Javascript提供了一個(gè)構(gòu)造函數(shù)（Constructor）模式葵硕。
所謂"構(gòu)造函數(shù)"眉抬，其實(shí)就是一個(gè)普通函數(shù)贯吓，但是內(nèi)部使用了<code>this</code>。對(duì)構(gòu)造函數(shù)使用<code>new</code>運(yùn)算符蜀变，就能生成實(shí)例悄谐，并且<code>this</code>變量會(huì)綁定在實(shí)例對(duì)象上。
比如库北，貓的原型對(duì)象現(xiàn)在可以這樣寫爬舰，
<pre>
function Cat(name,color){
this.name=name;
this.color=color;
}
</pre>
我們現(xiàn)在就可以生成實(shí)例對(duì)象了。
<pre>
var cat1 = new Cat("大毛","黃色");
var cat2 = new Cat("二毛","黑色");
alert(cat1.name); // 大毛
alert(cat1.color); // 黃色
</pre>
這時(shí)<code>cat1</code>和<code>cat2</code>會(huì)自動(dòng)含有一個(gè)<code>constructor</code>屬性寒瓦，指向它們的構(gòu)造函數(shù)情屹。
<pre>
alert(cat1.constructor == Cat); //true
alert(cat2.constructor == Cat); //true
</pre>
四、構(gòu)造函數(shù)模式的問(wèn)題
構(gòu)造函數(shù)方法很好用杂腰，但是存在一個(gè)浪費(fèi)內(nèi)存的問(wèn)題垃你。
請(qǐng)看，我們現(xiàn)在為<code>Cat</code>對(duì)象添加一個(gè)不變的屬性<code>type</code>（種類）颈墅，再添加一個(gè)方法<code>eat</code>（吃）蜡镶。那么，原型對(duì)象<code>Cat</code>就變成了下面這樣：
<pre>
function Cat(name,color){
this.name = name;
this.color = color;
this.type = "貓科動(dòng)物";
this.eat = function(){alert("吃老鼠");};
}
</pre>
還是采用同樣的方法恤筛，生成實(shí)例：
<pre>
var cat1 = new Cat("大毛","黃色");
var cat2 = new Cat ("二毛","黑色");
alert(cat1.type); // 貓科動(dòng)物
cat1.eat(); // 吃老鼠
</pre>
表面上好像沒(méi)什么問(wèn)題官还，但是實(shí)際上這樣做，有一個(gè)很大的弊端毒坛。那就是對(duì)于每一個(gè)實(shí)例對(duì)象望伦，<code>type</code>屬性和<code>eat()</code>方法都是一模一樣的內(nèi)容，每一次生成一個(gè)實(shí)例煎殷，都必須為重復(fù)的內(nèi)容屯伞，多占用一些內(nèi)存。這樣既不環(huán)保豪直，也缺乏效率劣摇。
<pre>
alert(cat1.eat == cat2.eat); //false
</pre>
五、<b>preototype</b>模式
Javascript規(guī)定弓乙，每一個(gè)構(gòu)造函數(shù)都有一個(gè)<code>prototype</code>屬性末融，指向另一個(gè)對(duì)象。這個(gè)對(duì)象的所有屬性和方法暇韧，都會(huì)被構(gòu)造函數(shù)的實(shí)例繼承勾习。
原型鏈：假設(shè)要查詢對(duì)象o的x屬性，如果o自身沒(méi)有x屬性懈玻，那么將會(huì)繼續(xù)在o的原型對(duì)象中查詢屬性x巧婶。如果o的原型對(duì)象中也沒(méi)有x屬性，那該原型對(duì)象也有原型，那繼續(xù)在原型對(duì)象的原型上執(zhí)行查詢艺栈，直到找到x或者查找到一個(gè)原型為null的對(duì)象為止英岭。
這意味著，我們可以把那些不變的屬性和方法眼滤，直接定義在<code>prototype</code>對(duì)象上巴席。
<pre>
function Cat(name,color){
this.name = name;
this.color = color;
}
Cat.prototype.type = "貓科動(dòng)物";
Cat.prototype.eat = function(){alert("吃老鼠")};
</pre>
然后生成實(shí)例。
<pre>
var cat1 = new Cat("大毛","黃色");
var cat2 = new Cat("二毛","黑色");
alert(cat1.type); // 貓科動(dòng)物
cat1.eat(); // 吃老鼠
</pre>
這時(shí)所有實(shí)例的<code>type</code>屬性和<code>eat()</code>方法诅需，其實(shí)都是同一個(gè)內(nèi)存地址漾唉，指向<code>prototype</code>對(duì)象，因此就提高了運(yùn)行效率堰塌。
六赵刑、<b>Prototype</b>模式的驗(yàn)證方法
為了配合<code>prototype</code>屬性，<code>Javascript</code>定義了一些輔助方法场刑，幫助我們使用它般此。
6.1 isPrototypeOf()
這個(gè)方法用來(lái)判斷，某個(gè)<code>proptotype</code>對(duì)象和某個(gè)實(shí)例之間的關(guān)系牵现。
<pre>
alert(Cat.prototype.isPrototypeOf(cat1)); //true
alert(Cat.prototype.isPrototypeOf(cat2)); //true
</pre>
6.2 hasOwnProperty()
每個(gè)實(shí)例對(duì)象都有一個(gè)<code>hasOwnProperty()</code>方法铐懊，用來(lái)判斷某一個(gè)屬性到底是本地屬性，還是繼承自<code>prototype</code>對(duì)象的屬性瞎疼。
<pre>
alert(cat1.hasOwnProperty("name")); // true
alert(cat1.hasOwnProperty("type")); // false
</pre>
6.3 in運(yùn)算符
<code>in</code>運(yùn)算符可以用來(lái)判斷科乎，某個(gè)實(shí)例是否含有某個(gè)屬性，不管是不是本地屬性贼急。
<pre>
alert("name" in cat1); // true
alert("type" in cat1); // true
</pre>
<code>in</code>運(yùn)算符還可以用來(lái)遍歷某個(gè)對(duì)象的所有屬性茅茂。
<pre>
for(var prop in cat1) { alert("cat1["+prop+"]="+cat1[prop]); }
</pre>
未完，更新中...
文檔轉(zhuǎn)載自阮一峰的網(wǎng)絡(luò)日志
