摘要：一組件化首先引用維基百科的一段介紹基于組件的軟件工程，簡(jiǎn)稱或基于組件的開(kāi)發(fā)，簡(jiǎn)稱是一種軟件開(kāi)發(fā)范型。除此之外，組件化能夠有效降低甚至消除耦合。三黑箱繼續(xù)引用維基百科的一句話介紹黑箱，指一個(gè)只知道輸入輸出關(guān)系而不知道內(nèi)部結(jié)構(gòu)的系統(tǒng)或設(shè)備。

終于完成了公司的一個(gè)大project，這期間的收獲也非常多，對(duì)于“組件化開(kāi)發(fā)”有了更深一層的心得體會(huì)。

在如今的前端開(kāi)發(fā)中，“組件化”已經(jīng)成為了一種流行，隨之而來(lái)的各種開(kāi)發(fā)框架更是把這一概念發(fā)揚(yáng)光大。但是概念歸概念，真正的“組件化”實(shí)踐還是有許多值得探討的地方，其中“黑箱”是我認(rèn)為最具有代表性的實(shí)踐方式。今天就讓我們拋開(kāi)具體的框架，直接來(lái)談一談“組件化開(kāi)發(fā)”與“黑箱”。

首先引用維基百科的一段介紹：

基于組件的軟件工程（Component-based software engineering，簡(jiǎn)稱CBSE）或基于組件的開(kāi)發(fā)（Component-Based Development，簡(jiǎn)稱CBD）是一種軟件開(kāi)發(fā)范型。它是現(xiàn)今軟件復(fù)用理論實(shí)用化的研究熱點(diǎn)，在組件對(duì)象模型的支持下，通過(guò)復(fù)用已有的構(gòu)件，軟件開(kāi)發(fā)者可以“即插即用”地快速構(gòu)造應(yīng)用軟件。這樣不僅可以節(jié)省時(shí)間和經(jīng)費(fèi)，提高工作效率，而且可以產(chǎn)生更加規(guī)范、更加可靠的應(yīng)用軟件。

在業(yè)務(wù)的開(kāi)發(fā)中，我們往往會(huì)把一些需要復(fù)用的部分抽取出來(lái)多帶帶封裝，在需要的時(shí)候再引入使用。這樣就相當(dāng)于把這可復(fù)用的部分進(jìn)行了“組件化”。組件化的操作能夠大大減少開(kāi)發(fā)量，同時(shí)一個(gè)好的組件也能有效提升穩(wěn)定性。在現(xiàn)代化的web開(kāi)發(fā)中，“組件”通常包含了邏輯功能和樣式，各種各樣的UI庫(kù)正是最好的例子。比如一個(gè)交互復(fù)雜的下拉菜單，如果每次使用前都要重新寫(xiě)一套代碼，將會(huì)徒增巨大的時(shí)間與人力成本。而通過(guò)UI庫(kù)，只需要簡(jiǎn)單地引入，按照約定的寫(xiě)法引用即可，大大解放了生產(chǎn)力。

除此之外，“組件化”能夠有效降低甚至消除耦合。我們知道“牽一發(fā)而動(dòng)全身”，如果一個(gè)系統(tǒng)各模塊之間耦合太緊，一旦有個(gè)地方出現(xiàn)問(wèn)題，排查起來(lái)將會(huì)非常困難，其后果可能是災(zāi)難性的。而“組件化”的思路能夠很好地避免這個(gè)問(wèn)題。因?yàn)榻M件之間是相互獨(dú)立，僅僅通過(guò)接口相聯(lián)系，一旦某個(gè)組件出現(xiàn)問(wèn)題，只需要排查這個(gè)組件的故障即可，其他組件完全可以正常工作，或者等待這個(gè)組件修復(fù)后再工作。

維基百科定義：

在程序設(shè)計(jì)中，若一個(gè)函數(shù)符合以下要求，則它可能被認(rèn)為是純函數(shù)：

此函數(shù)在相同的輸入值時(shí)，需產(chǎn)生相同的輸出。函數(shù)的輸出和輸入值以外的其他隱藏信息或狀態(tài)無(wú)關(guān)，也和由I/O設(shè)備產(chǎn)生的外部輸出無(wú)關(guān)。
該函數(shù)不能有語(yǔ)義上可觀察的函數(shù)副作用，諸如“觸發(fā)事件”，使輸出設(shè)備輸出，或更改輸出值以外物件的內(nèi)容等。

從數(shù)學(xué)來(lái)說(shuō)，若定義一個(gè)函數(shù)：

f(x) = x + x

那么不管何時(shí)何地任何條件，只要我輸入1，那么一定會(huì)輸出2：

f(1) == 2

正是因?yàn)檫@種“純”的特性，所以允許對(duì)其進(jìn)行“高階”：

f(x) = x + x

g(x) = x * 2

h(x) = x * x

h(g(f(1))) = 16

網(wǎng)絡(luò)上對(duì)于純函數(shù)和函數(shù)式編程的文章非常豐富，本文就不再贅述了。從我個(gè)人角度出發(fā)，只要能理解什么是“純”即可。

繼續(xù)引用維基百科的一句話介紹：

黑箱，指一個(gè)只知道輸入輸出關(guān)系而不知道內(nèi)部結(jié)構(gòu)的系統(tǒng)或設(shè)備。

生活中的很多東西都可以理解為“黑箱”，比如我們常用的手機(jī)，我們可能不知道它到底是怎么運(yùn)行的，只知道我的手指劃過(guò)，它就會(huì)作出相應(yīng)的動(dòng)作，這時(shí)，手指劃過(guò)就是“輸入”，相應(yīng)的動(dòng)作就是“輸出”。因?yàn)檩斎胼敵鋈绱酥庇^簡(jiǎn)單，所以手機(jī)能夠被所有人輕松地使用。

我們的工作離不開(kāi)電腦，現(xiàn)在電腦只要插上電源開(kāi)機(jī)就能用，但是人類歷史上的第一臺(tái)電腦，卻是要專業(yè)人士花費(fèi)一番功夫才能運(yùn)行的龐然大物——因?yàn)槭褂谜咝枰耆@臺(tái)機(jī)器的內(nèi)部運(yùn)行原理，才能夠正確地使用它。

上述的兩個(gè)例子，其實(shí)都是為了闡述一個(gè)觀點(diǎn)：黑箱更有利于使用。

但是，凡事都具有兩面性。黑箱是犧牲了使用者對(duì)于其內(nèi)部構(gòu)造和原理的認(rèn)識(shí)，換來(lái)的易用性。如果黑箱內(nèi)部出現(xiàn)故障，那么使用者無(wú)法得知具體原因，這個(gè)對(duì)于系統(tǒng)故障的排查非常不利。所以黑箱對(duì)于系統(tǒng)的穩(wěn)定性、可靠性的要求非常高。

經(jīng)過(guò)前文的三個(gè)小節(jié)，應(yīng)該不難理解我想表達(dá)的觀點(diǎn)。一個(gè)黑箱就是一個(gè)純函數(shù)，抽象出來(lái)的組件理應(yīng)符合這種黑箱的設(shè)定：

組件之間僅通過(guò)接口聯(lián)系
一個(gè)組件可以接收多個(gè)參數(shù)，組件的嵌套和使用也是通過(guò)接口進(jìn)行。組件在處理完傳入的參數(shù)后，應(yīng)當(dāng)把結(jié)果通過(guò)接口（或者事件）傳遞出去，而不能直接影響外部。比如下面這個(gè)例子，經(jīng)過(guò)f(x)的處理，外部的num并不會(huì)被改變。

num = 1
f(x) = x + 1
// f(num) => 2
// num => 1

組件內(nèi)部的運(yùn)行原理不對(duì)用戶開(kāi)放
很容易理解，組件應(yīng)當(dāng)是一個(gè)黑箱，用戶無(wú)需關(guān)注內(nèi)部的實(shí)現(xiàn)原理。當(dāng)然，組件應(yīng)該保證高度的穩(wěn)定性和可靠性。

組件的輸入輸出完全確定
結(jié)合“純函數(shù)”和“黑箱”的概念，一個(gè)組件應(yīng)當(dāng)是可預(yù)測(cè)的（predictable），只有完全確定的輸入輸出才能保證。因此在工程實(shí)踐中，強(qiáng)制規(guī)定輸入的數(shù)據(jù)類型、變量名之類的內(nèi)容是非常必須的。

組件化的開(kāi)發(fā)還有許多最佳實(shí)踐，比如涵蓋了一定邏輯功能的“業(yè)務(wù)組件”也是值得探討的地方。本文僅為個(gè)人在開(kāi)發(fā)時(shí)的一些感悟，權(quán)當(dāng)拋磚引玉，歡迎各位讀者和我共同交流~感謝閱讀~~~