From：http://www.ajaxwing.com/index.php?id=2


一，背景
回顧一下編程語(yǔ)言的發(fā)展，不難發(fā)現(xiàn)這是一個(gè)不斷封裝的過程：從最開始的匯編語(yǔ)言，到面向過程語(yǔ)言，然后到面向?qū)ο笳Z(yǔ)言，再到具備面向?qū)ο筇匦缘哪_本語(yǔ)言，一層一層封裝，一步一步減輕程序員的負(fù)擔(dān)，逐漸提高編寫程序的效率。這篇文章是關(guān)于 JavaScript 的，所以我們先來了解一下 JavaScript 是一種怎樣的語(yǔ)言。到目前為止，JavaScript 是一種不完全支持面向?qū)ο筇匦缘哪_本語(yǔ)言。之所以這樣說是因?yàn)?nbsp;JavaScript 的確支持對(duì)象的概念，在程序中我們看到都是對(duì)象，可是 Javascipt 并不支持類的封裝和繼承。曾經(jīng)有過 C++、Java或者 php、python 編程經(jīng)驗(yàn)的讀者都會(huì)知道，這些語(yǔ)言允許我們使用類來設(shè)計(jì)對(duì)象，并且這些類是可繼承的。JavaScript 的確支持自定義對(duì)象和繼承，不過使用的是另外一種方式：prototype（中文譯作：原型）。用過 JavaScript 的或者讀過《設(shè)計(jì)模式》的讀者都會(huì)了解這種技術(shù)，描述如下：

每個(gè)對(duì)象都包含一個(gè) prototype 對(duì)象，當(dāng)向?qū)ο蟛樵円粋€(gè)屬性或者請(qǐng)求一個(gè)方法的時(shí)候，運(yùn)行環(huán)境會(huì)先在當(dāng)前對(duì)象中查找，如果查找失敗則查找其 prototype 對(duì)象。注意 prototype 也是一個(gè)對(duì)象，于是這種查找過程同樣適用在對(duì)象的 prototype 對(duì)象中，直到當(dāng)前對(duì)象的 prototpye 為空。

在 JavaScript 中，對(duì)象的 prototype 在運(yùn)行期是不可見的，只能在定義對(duì)象的構(gòu)造函數(shù)時(shí)，創(chuàng)建對(duì)象之前設(shè)定。下面的用法都是錯(cuò)誤的：

o2.prototype = o1;
/*
  這時(shí)只定義了 o2 的一個(gè)名為“prototype”的屬性，
  并沒有將 o1 設(shè)為 o2 的 prototype。
*/

// ---------------

f2 = function(){};
o2 = new f2;
f2.prototype = o1;
/*
  這時(shí) o1 并沒有成為 o2 的 prototype，
  因?yàn)?nbsp;o2 在 f2 設(shè)定 prototype 之前已經(jīng)被創(chuàng)建。
*/

// ---------------

f1 = function(){};
f2 = function(){};
o1 = new f1;
f2.prototype = o1;
o2 = new f2;
/*
  同樣，這時(shí) o1 并不是 o2 的 prototype，
  因?yàn)?nbsp;JavaScript 不允許構(gòu)造函數(shù)的 prototype 對(duì)象被其它變量直接引用。
*/

正確的用法應(yīng)該是：

f1 = function(){};
f2 = function(){};
f2.prototype = new f1;
o2 = new f2;

從上面的例子可以看出：如果你想讓構(gòu)造函數(shù) F2 繼承另外一個(gè)構(gòu)造函數(shù) F1 所定義的屬性和方法，那么你必須先創(chuàng)建一個(gè) F1 的實(shí)例對(duì)象，并立刻將其設(shè)為 F2 的 prototype。于是你會(huì)發(fā)現(xiàn)使用 prototype 這種繼承方法實(shí)際上是不鼓勵(lì)使用繼承：一方面是由于 JavaScript 被設(shè)計(jì)成一種嵌入式腳本語(yǔ)言，比方說嵌入到瀏覽器中，用它編寫的應(yīng)用一般不會(huì)很大很復(fù)雜，不需要用到繼承；另一方面如果繼承得比較深，prototype 鏈就會(huì)比較長(zhǎng)，用在查找對(duì)象屬性和方法的時(shí)間就會(huì)變長(zhǎng)，降低程序的整體運(yùn)行效率。