Javascript 中萬(wàn)事萬(wàn)物皆是對(duì)象狈蚤， 雖然不嚴(yán)謹(jǐn)(JS中數(shù)據(jù)類(lèi)型除了對(duì)象還有其他基本類(lèi)型)脆侮。一定程度上表明了它本質(zhì)上是一門(mén)面向?qū)ο蟮恼Z(yǔ)言勇劣，即使它實(shí)現(xiàn)面向?qū)ο笫腔谠汀?/p>
從開(kāi)始學(xué)習(xí)JS，面向?qū)ο蟮娜笫ソ?jīng)(特性)：封裝幻捏、繼承退敦、多態(tài)侈百，一直作為JS 中最佳實(shí)踐的標(biāo)準(zhǔn)翰铡，但是隨著知識(shí)積累, 你可能有類(lèi)似這樣的一些疑問(wèn)：
1、JS中又沒(méi)有“類(lèi)”這樣的實(shí)現(xiàn)例证，為什么需要定義一個(gè)類(lèi)似“類(lèi)”一樣的東西迷捧？
2胀葱、JS中實(shí)現(xiàn)面向?qū)ο笸ㄟ^(guò)原型的思想笙蒙，按照傳統(tǒng)面向?qū)ο蠖鄳B(tài)的實(shí)踐必然會(huì)導(dǎo)致代碼的bug捅位。
3、JS 中的最佳實(shí)踐到底是什么艇搀？
....
其實(shí)這些問(wèn)題都是一個(gè)問(wèn)題焰雕，傳統(tǒng)的面向?qū)ο蟮脑O(shè)計(jì)是否適合JS。
要回答這個(gè)問(wèn)題需要先弄明白2個(gè)概念：類(lèi)與原型右莱。
類(lèi)理論
類(lèi) / 繼承描述了一種代碼的組織結(jié)構(gòu)形式——一種在軟件中對(duì)真實(shí)世界中問(wèn)題領(lǐng)域的建模方法档插。
類(lèi)郭膛，是一種抽象的表示，對(duì)應(yīng) "類(lèi)" 的是"實(shí)例"耘柱。
舉個(gè)栗子棍现，建筑師繪制會(huì)繪制出一個(gè)建筑的所有特性：高，寬士袄，多少個(gè)房間甚至多少個(gè)窗戶等等娄柳，但是他不會(huì)關(guān)心需要建多少個(gè)這樣的建筑艘绍，他也不會(huì)關(guān)心，建筑使用的什么水泥和鋼鐵挎挖。施工人員會(huì)基于建筑師的藍(lán)圖來(lái)建造。完成之后鹅颊，建筑就成了藍(lán)圖的物理的實(shí)例堪伍，藍(lán)圖就是抽象的類(lèi)觅闽。
把類(lèi)和實(shí)例對(duì)象之間的關(guān)系看作是直接關(guān)系而不是間接關(guān)系通常更有助于理解。類(lèi)通過(guò)復(fù)制操作被實(shí)例化為對(duì)象形式:
箭頭的方向是從左向右尸闸、從上向下吮廉，它表示概念和物理意義上發(fā)生的復(fù)制操作畸肆。
在許多面向類(lèi)的語(yǔ)言中轴脐，“標(biāo)準(zhǔn)庫(kù)”會(huì)提供 Stack 類(lèi)，它是一種“椞窠В”數(shù)據(jù)結(jié)構(gòu)(支持壓 入碴巾、彈出厦瓢，等等)。Stack 類(lèi)內(nèi)部會(huì)有一些變量來(lái)存儲(chǔ)數(shù)據(jù)碳锈，同時(shí)會(huì)提供一些公有的可訪問(wèn) 行為(“方法”)欺抗，從而讓你的代碼可以和(隱藏的)數(shù)據(jù)進(jìn)行交互(比如添加绞呈、刪除數(shù)據(jù))。
但是在這些語(yǔ)言中艺智，你實(shí)際上并不是直接操作 Stack(除非創(chuàng)建一個(gè)靜態(tài)類(lèi)成員引用圾亏，這超出了我們的討論范圍)志鹃。Stack 類(lèi)僅僅是一個(gè)抽象的表示，它描述了所有“楃智鳎”需要做的 事陕见，但是它本身并不是一個(gè)“椘捞穑”。你必須先實(shí)例化 Stack 類(lèi)然后才能對(duì)它進(jìn)行操作谋竖。
原型
JavaScript 常被描述為一種基于原型的語(yǔ)言 (prototype-based language)——每個(gè)對(duì)象擁有一個(gè)原型對(duì)象承匣，對(duì)象以其原型為模板韧骗、從原型繼承方法和屬性。原型對(duì)象也可能擁有原型些侍，并從中繼承方法和屬性政模，一層一層淋样、以此類(lèi)推。這種關(guān)系常被稱(chēng)為原型鏈 (prototype chain)刊咳，它解釋了為何一個(gè)對(duì)象會(huì)擁有定義在其他對(duì)象中的屬性和方法彪见。
JS中所有內(nèi)置對(duì)象以及通過(guò)字面量聲明的對(duì)象的原型都最終指向Object.prototype。原型對(duì)象是JS實(shí)現(xiàn)面向?qū)ο蟮幕A(chǔ)娱挨，所以說(shuō)JS中萬(wàn)物皆對(duì)象也有一定的道理余指，因?yàn)樗淮嬖陬?lèi)的概念。所有通過(guò)New關(guān)鍵字實(shí)例化的過(guò)程跷坝，并不是復(fù)制的過(guò)程酵镜，而是鏈接的過(guò)程，將原型鏈接到生成的對(duì)象的過(guò)程柴钻。
這一張圖或許你很熟悉笋婿，它將實(shí)例對(duì)象與原型對(duì)象之前的關(guān)系表示了出來(lái)。
通過(guò)上面的介紹缸濒，我們了解到：
- JS 中沒(méi)有類(lèi)的概念（ES6中新增的class 的實(shí)踐也只是原型模式的語(yǔ)法糖），實(shí)現(xiàn)繼承是通過(guò)原型粱腻，實(shí)現(xiàn)的過(guò)程是鏈接而不是復(fù)制庇配，所以一旦修改了原型對(duì)象（類(lèi)中的父類(lèi)），就會(huì)影響造成所有關(guān)聯(lián)的子對(duì)象（基于類(lèi)的實(shí)現(xiàn)中不會(huì)有這樣的問(wèn)題绍些，每一個(gè)實(shí)例都是相對(duì)獨(dú)立的存在）捞慌。
- 多態(tài)必將是一個(gè)丑陋的實(shí)踐。由于對(duì)象之間是關(guān)聯(lián)的關(guān)系柬批，所以要實(shí)現(xiàn)方法的多態(tài)啸澡，將會(huì)覆蓋原型鏈上原本的方法的實(shí)踐，從而影響整個(gè)關(guān)聯(lián)的對(duì)象氮帐。
然而問(wèn)題來(lái)了嗅虏，我們?nèi)绻话凑彰嫦驅(qū)ο蟮奶匦詠?lái)實(shí)踐，為之奈何上沐。
面向委托
這是一種極其強(qiáng)大的設(shè)計(jì)模式皮服，和父類(lèi)、子類(lèi)参咙、繼承龄广、多態(tài)等概念完全不同。在你的腦海中
對(duì)象并不是按照父類(lèi)到子類(lèi)的關(guān)系垂直組織的蕴侧，而是通過(guò)任意方向的委托關(guān)聯(lián)并排組織的择同。
由于原型鏈等特性的存在，在不同對(duì)象之間功能的共享通常被叫做 委托 - 特殊的對(duì)象將功能委托給通用的對(duì)象類(lèi)型完成净宵。這也許比將其稱(chēng)之為繼承更為貼切敲才，因?yàn)椤氨焕^承”了的功能并沒(méi)有被拷貝到正在“進(jìn)行繼承”的對(duì)象中裹纳，相反它仍存在于通用的對(duì)象中。
下面是面向?qū)ο?類(lèi))和面向委托的實(shí)踐對(duì)比归斤。
面向?qū)ο箫L(fēng)格("原型")
function Foo(who) {
this.me = who;
}
Foo.prototype.identify = function () {
return "I am " + this.me;
};
function Bar(who) {
Foo.call(this, who);
}
Bar.prototype = Object.create(Foo.prototype);
Bar.prototype.speak = function () {
alert("Hello, " + this.identify() + ".");
};
const b1 = new Bar("b1");
const b2 = new Bar("b2");
b1.speak();
b2.speak();
子類(lèi) Bar 繼承了父類(lèi) Foo，然后生成了 b1 和 b2 兩個(gè)實(shí)例刁岸。b1 委托了 Bar.prototype脏里，后者委托了 Foo.prototype。
面向委托風(fēng)格(對(duì)象關(guān)聯(lián))
Foo = {
init: function (who) {
this.me = who;
},
identify: function () {
return "I am " + this.me;
}
};
Bar = Object.create(Foo);
Bar.speak = function () {
alert("Hello, " + this.identify() + ".");
};
const b1 = Object.create(Bar);
b1.init("b1");
const b2 = Object.create(Bar);
b2.init("b2");
b1.speak();
b2.speak();
思維模型：
這段代碼中同樣利用 [[Prototype]] 把 b1 委托給 Bar 并把 Bar 委托給 Foo虹曙，和上一段代碼一模一樣, 仍然實(shí)現(xiàn)了三個(gè)對(duì)象之間的關(guān)聯(lián)迫横。
對(duì)比兩種實(shí)現(xiàn)方式，面向委托的設(shè)計(jì)更加簡(jiǎn)潔酝碳。只是把對(duì)象關(guān)聯(lián)起來(lái)矾踱，并不需要做那些復(fù)雜又讓人困惑的模仿類(lèi)的行為(構(gòu)造函數(shù)，原型疏哗，以及new)呛讲。
并且對(duì)象關(guān)聯(lián)可以更好地支持關(guān)注分離(separation of concerns)原則，創(chuàng)建和初始化并不需要們出現(xiàn)在不同的位置返奉，合并為一個(gè)步驟贝搁。
總結(jié)來(lái)說(shuō)，我們?cè)诤罄m(xù)的實(shí)踐中芽偏，可以嘗試采用面向委托的模式雷逆，因?yàn)樗N近JS語(yǔ)言的設(shè)計(jì)思想。
但是并不是說(shuō)我們要拋棄面向?qū)ο笪畚荆嫦驅(qū)ο蟮乃枷胍彩呛苤匾陌蛘堋Ｋ峁┑乃季S模式，讓我們把物理世界的事物抽象成對(duì)象, 這是面向?qū)ο笳Z(yǔ)言編程的基礎(chǔ)被碗。所以我們可以基于面向的對(duì)象的思想來(lái)完成物理世界的抽象以及封裝某宪，使用面向委托的思想來(lái)構(gòu)建對(duì)象，同樣的在JS 中采用函數(shù)式編程的思想來(lái)執(zhí)行锐朴，這才是王道缩抡。
- 參考:《你所不知道的Javascript》
