2019 年編寫現代 JavaScript 代碼的5個小技巧

內容基本是今年從其餘大神的文章學習到的東西。出處在底下。

一、Array.includes 與條件判斷

通常咱們判斷或用 ||

若是咱們有更多水果

二、Set 與去重

ES6 提供了新的數據結構 Set。它相似於數組，可是成員的值都是惟一的，沒有重複的值。Set 自己是一個構造函數，用來生成 Set 數據結構。

數組去重

Array.from 方法能夠將 Set 結構轉爲數組。咱們能夠專門編寫使用一個去重的函數

字符去重

另外 Set 是如此強大，所以使用 Set 能夠很容易地實現並集（Union）、交集（Intersect）和差集（Difference）。

三、Map 與字典類型數據

通常而已，JavaScript 實現字典數據是基於 Object 對象。可是 JavaScript 的對象的鍵只能是字符串。對於編程來講有不少不便。 ES6 提供了 Map 數據結構。它相似於 Object 對象，也是鍵值對的集合，可是「鍵」的範圍不限於字符串，各類類型的值，字符串、數值、布爾值、數組、對象等等均可以看成鍵。

Map 的遍歷順序就是插入順序

四、函數式的方式處理數據

按照個人理解，函數式編程主張函數必須接受至少一個參數並返回一個值。因此全部的關於數據的操做，均可以用函數式的方式處理。

假設咱們有這樣的需求，須要先把數組 foo 中的對象結構更改，而後從中挑選出一些符合條件的對象，而且把這些對象放進新數組 result 裏。

從直覺上咱們很容易寫出這樣的代碼：

使用函數式的寫法，能夠優雅得多

數組求和

五、compose 與函數組合

如下代碼稱爲組合 compose

因爲函數式編程大行其道，因此如今將會在 JavaScript 代碼看到大量的箭頭()=>()=>()=>的代碼。

ES6 版本 compose

在 compose 的定義中， g 將先於 f 執行，所以就建立了一個從右到左的數據 流。這樣作的可讀性遠遠高於嵌套一大堆的函數調用.

咱們選擇一些函數，讓它們結合，生成一個嶄新的函數。

reverse 反轉列表， head 取列表中的第一個元素；

可是咱們這個這個compose不夠完善，只能處理兩個函數參數。redux源碼有個很完備的compose函數，咱們借鑑一下。

有了這個函數，咱們能夠隨意組合無數個函數。如今咱們增長需求，組合出一個lastAndUpper函數，內容是先reverse 反轉列表， head 取列表中的第一個元素, 最後toUpperCase大寫。

做者：廖振廷

原文連接：https://zhuanlan.zhihu.com/p/54758068