常工作中，我確實(shí)經(jīng)常去幫大家review代碼，長(zhǎng)期以來(lái)，我發(fā)現(xiàn)有些個(gè)功能函數(shù)，JS其實(shí)可以稍微調(diào)整一下，或者換個(gè)方式來(lái)處理，代碼就會(huì)看起來(lái)更清晰，更簡(jiǎn)潔，甚至效率更高，主要是還更好理解。

下面我列舉5個(gè)案例，我們一起來(lái)看一下

一、建議考慮使用FlatMap方法

先來(lái)看一段同時(shí)使用filter和map方法遍歷數(shù)組的代碼。我相信這種場(chǎng)景大家一定碰到過(guò)。為了說(shuō)明問(wèn)題，這里我用簡(jiǎn)單的數(shù)字內(nèi)容來(lái)舉個(gè)例子。

上面代碼這樣寫，沒什么問(wèn)題，而且方法的連用也是比較推薦的處理方式， 但是，還是請(qǐng)多想想，其實(shí)我們有更好的方式來(lái)處理這一類問(wèn)題。

現(xiàn)在我們看使用FlatMap如何實(shí)現(xiàn)的

使用FlatMap的好處是

只要遍歷一遍，而且不產(chǎn)生中間多余數(shù)組

二、建議調(diào)整數(shù)組方法調(diào)用的順序

日常工作中寫的比較多的數(shù)組方法有filter()，find()，map()，reduce()，在必要的場(chǎng)景下，我們也建議將這些個(gè)方法連起來(lái)一起調(diào)用。但是，一定要注意調(diào)用順序，否則也會(huì)影響效率問(wèn)題。

比如下面這樣：

仔細(xì)看上面這段代碼，你就會(huì)發(fā)現(xiàn)

如果我們首先使用過(guò)濾器，然后排序，這樣執(zhí)行就能提高效率

三、建議這里使用reduce方法

你寫的代碼一定要讓大家看的懂，代碼要簡(jiǎn)潔，然而，有些方法它就出于這個(gè)目的創(chuàng)造的，如果你又不用，那就太可惜了，比如reduce方法。

舉個(gè)例子，我們先從接口中拉出一段數(shù)據(jù)，然后對(duì)數(shù)據(jù)內(nèi)容進(jìn)行分類處理，像下面代碼這樣

我看到大多數(shù)前端開發(fā)人員都會(huì)使用forEach方法或者錯(cuò)誤的使用map方法去處理，相比之下，實(shí)際上這里特別適合使用reduce方法

看起來(lái)會(huì)更清晰而且更容易理解

四、建議使用原生JavaScript類

上面這張很清晰明了的拆解了URL的每一部分

關(guān)于頁(yè)面的URL我們可以組裝也可以拆卸，這里說(shuō)一下URL各部分的組裝問(wèn)題，你現(xiàn)在或者曾經(jīng)肯定處理過(guò)URL拼接的問(wèn)題，代碼可能是這么寫的

這樣寫雖然能夠?qū)崿F(xiàn)，但是代碼看起來(lái)很混亂，很可能會(huì)被破壞，并且每次都需要你在最后添加一些規(guī)則，添加一些其他參數(shù)。

比如，你可能忘記添加/或者&符號(hào)就會(huì)導(dǎo)致錯(cuò)誤，下面看看原生類怎么實(shí)現(xiàn)的，可以對(duì)比一下兩者區(qū)別

這樣看來(lái)，在處理URL組裝問(wèn)題上是不是可以考慮使用原生類了？

五、建議使用生成器

提到生成器，大家可能只是聽過(guò)，或者知道怎么使用，而實(shí)際項(xiàng)目中很少去用。實(shí)際上它有很多使用場(chǎng)景。

使用生成器能夠節(jié)省很多代碼，代碼也非常清晰。如，進(jìn)行異步操作或者按需循環(huán)或者按需加載時(shí)。

看這段代碼：

上面代碼中main函數(shù)，可以根據(jù)用戶交互或者其它技巧來(lái)調(diào)用。因?yàn)檫@里不希望無(wú)限加載。

總結(jié)

好了，就說(shuō)這幾點(diǎn)，日常工作中，希望大家都寫出高質(zhì)量的代碼。

在程序設(shè)計(jì)語(yǔ)言中函數(shù)是一段具有特殊功能的代碼，同時(shí)也是一組可以重復(fù)使用的代碼。通過(guò)函數(shù)這一對(duì)象的使用，進(jìn)一步提高了程序開發(fā)的模塊化與高度多的代碼復(fù)用性。各種程序設(shè)計(jì)語(yǔ)言都對(duì)函數(shù)的定義及使用有著嚴(yán)格的語(yǔ)法規(guī)則。本文主要介紹如何在JavaScript中定義函數(shù)、使用函數(shù)，并對(duì)遞歸函數(shù)這一特殊類型函數(shù)進(jìn)行說(shuō)明。

JavaScript函數(shù)基本語(yǔ)法

JavaScript中所定義的函數(shù)主要由函數(shù)定義關(guān)鍵字、函數(shù)名稱、函數(shù)參數(shù)、執(zhí)行代碼段與函數(shù)返回值5部分所組成。同時(shí)要求函數(shù)在使用過(guò)程中需要先定義函數(shù)，再調(diào)用函數(shù)。JavaScript函數(shù)定義基本語(yǔ)法描述如下：

JavaScript函數(shù)定義基本語(yǔ)法描述如上圖，說(shuō)明如下：

函數(shù)調(diào)用與形參&實(shí)參

函數(shù)定義完成之后，就可以通過(guò)調(diào)用該函數(shù)完成特定的功能。函數(shù)調(diào)用方式較為簡(jiǎn)單，只需要給出函數(shù)名稱與所傳遞參數(shù)，如果參數(shù)為空，只需要給出名稱后面的括號(hào)即可。關(guān)于參數(shù)部分需要注意形參與實(shí)參概念的區(qū)分。其中在函數(shù)定義中用于解釋說(shuō)明語(yǔ)言的參數(shù)為形參。在函數(shù)調(diào)用過(guò)程中替代形參參與實(shí)際運(yùn)算的參數(shù)為實(shí)參。示例說(shuō)明如下：

匿名函數(shù)

匿名函數(shù)（Anonymous function），顧名思義是指沒有名字的函數(shù)，即在上面給出的基本語(yǔ)法中functionName部分可以省略的函數(shù)。在JavaScript中提供兩類基本匿名函數(shù)定義方式，一種是將匿名函數(shù)封裝為表達(dá)式，一種是將匿名函數(shù)賦值給變量形式。兩類匿名函數(shù)基本語(yǔ)法描述如下：

匿名函數(shù)定義形式描述如上圖所示，上文中計(jì)算解決值函數(shù)我們可以使用兩種方法改寫為匿名函數(shù)，實(shí)現(xiàn)描述如下：

遞歸函數(shù)

遞歸函數(shù)是一類特殊的函數(shù)類型，簡(jiǎn)單理解即為在一個(gè)函數(shù)的內(nèi)部調(diào)用了該函數(shù)自身。在使用遞歸函數(shù)是需要注意產(chǎn)生遞歸的條件與遞歸終止的條件。如同循環(huán)控制語(yǔ)句一樣，沒有遞歸終止的條件，程序?qū)?huì)一直占用資源，無(wú)法結(jié)束釋放資源。遞歸函數(shù)的說(shuō)明可以從階乘的計(jì)算這一案例展開說(shuō)明。階乘計(jì)算過(guò)程描述如下：

階乘計(jì)算過(guò)程描述如上圖所示，我們可知階乘問(wèn)題的解決主要在于遞推關(guān)系的挖掘與終止條件的確定。本例中遞推關(guān)系為N!=N*(N-1)！，終止條件為1！=1；在明確這兩點(diǎn)之后我們可以編寫遞歸函數(shù)實(shí)現(xiàn)問(wèn)題求解。遞歸函數(shù)描述如下圖：

經(jīng)典遞歸問(wèn)題舉例

爬樓梯問(wèn)題是使用遞歸算法進(jìn)行問(wèn)題求解的經(jīng)典案例之一，爬樓梯問(wèn)題主要只是假設(shè)有N階樓梯，需要從最底層爬到最高層，在上樓過(guò)程中每步只允許上1層或者2層，計(jì)算爬到N層總共方法有多少種？

爬樓梯方法問(wèn)題采用遞歸思想還是比較簡(jiǎn)單的，我們可以從小人最后一步考慮。小人上到最高層N層時(shí)只能有兩種方法：

①?gòu)腘-2層跨越2層到達(dá)N層；

②從N-1層跨越1層到達(dá)N層；

則計(jì)算到達(dá)N層的方法f(n)就等于到達(dá)N-1層方法f(n-1)與達(dá)N-2層方法f(n-2)之和。這就找到了我們進(jìn)行遞推的關(guān)系式，終止條件即為f(1)=1和f(2)=2;

因此我們可以編程實(shí)現(xiàn)計(jì)算，實(shí)現(xiàn)代碼如下：

本頭條號(hào)長(zhǎng)期關(guān)注編程資訊分享；編程課程、素材、代碼分享及編程培訓(xùn)。如果您對(duì)以上方面有興趣或代碼錯(cuò)誤、建議與意見，可以聯(lián)系作者，共同探討。更多程序設(shè)計(jì)相關(guān)教程及實(shí)例分享，期待大家關(guān)注與閱讀！JavaScript基礎(chǔ)教程系列教程鏈接如下：

JavaScript基礎(chǔ)教程（六）流程控制之循環(huán)語(yǔ)句

JavaScript基礎(chǔ)教程（五）流程控制之條件語(yǔ)句