在日常工作中，你可能寫過(guò)很多JavaScript代碼，有些基礎(chǔ)性的功能，甚至那些需要重復(fù)使用的業(yè)務(wù)功能，總不愿意重復(fù)再寫上一遍。

如果是通過(guò)復(fù)制的方式來(lái)達(dá)到重用目的話，暫不說(shuō)復(fù)制來(lái)復(fù)制去容易出錯(cuò)，一旦使用該功能的業(yè)務(wù)達(dá)到上十個(gè)之多時(shí)，任何一個(gè)重用的基礎(chǔ)功能出現(xiàn)BUG，都要在各個(gè)業(yè)務(wù)同步修復(fù)，費(fèi)時(shí)費(fèi)力，***把自己搞的精疲力盡，從此厭惡寫代碼，甚至對(duì)生活失去信心，哈哈。

那如何提高這種JS代碼的重用性呢?(這句話等同于如何提升開發(fā)效率)

那就是學(xué)會(huì)包裝那部分可重用的代碼，接下來(lái)我談一下自己的看法，及我平時(shí)是怎么做的。

一. 如果你是正常的流式開發(fā)

如果你的代碼是一個(gè)大文件，找機(jī)會(huì)把可以重用的功能提取到自包含的對(duì)象中，放入到一個(gè)單獨(dú)的庫(kù)中。

若發(fā)現(xiàn)已經(jīng)有了在所有項(xiàng)目開發(fā)中重復(fù)使用的一組函數(shù)，考慮將它們打包，以通過(guò)一個(gè)對(duì)象直接量來(lái)重用。

下面舉一個(gè)簡(jiǎn)單的例子：

下面這段代碼，包含三個(gè)可以在各個(gè)業(yè)務(wù)中高度復(fù)用的功能。

我們可以將它轉(zhuǎn)換成一個(gè)對(duì)象的自面量的形式來(lái)重用。如下所示：

上面我們?nèi)×巳挚臻g中的3個(gè)函數(shù)，并且將它們轉(zhuǎn)換為一個(gè)對(duì)象上的三個(gè)方法，這不僅減少了全局空間中的雜亂，而且有助于防止與其它庫(kù)中類似的函數(shù)名稱相沖突。

二. 如果你是組件化開發(fā)項(xiàng)目

近年來(lái)，組件化的方式開發(fā)項(xiàng)目成為業(yè)界主流。那么組件化開發(fā)時(shí)，我們是如何包裝可重用代碼的了。

1. 寫成組件

同一個(gè)在項(xiàng)目里，一般都會(huì)有一些需要重用的基礎(chǔ)功能模塊和基礎(chǔ)業(yè)務(wù)UI組件，可以將這些分別獨(dú)立寫在一個(gè)文件里，供其它各個(gè)業(yè)務(wù)模塊進(jìn)行調(diào)用。特別是在多人合作的團(tuán)隊(duì)中，這樣能極大的提高開發(fā)效率。尤其是使用ES6語(yǔ)法之后，公共組件的組裝也變得更加靈活和簡(jiǎn)單。

2. 封裝成安裝包

正如文章開頭所說(shuō)的，在不同的業(yè)務(wù)中如何更高效的共享這些公用基礎(chǔ)模塊，我們一般都是將其封裝成一個(gè)npm安裝包。發(fā)到npm庫(kù)中，(當(dāng)然，T公司有自己的私有庫(kù)，類似于NPM)項(xiàng)目使用的時(shí)候直接在項(xiàng)目所在的目錄中運(yùn)行npm install XXX --save就可以。維護(hù)起來(lái)是不是更多加方便了。

***總結(jié)一下

學(xué)會(huì)可重用代碼的包裝，是前端開發(fā)人員必須具備的一項(xiàng)能力，因?yàn)檫@能極大提高我們的開發(fā)效率，降低代碼的出錯(cuò)率。讓你變得更開心，生活質(zhì)量更高等等。