Array的幾個小技巧

你什麼都不懂發表於2018-07-30

1.迭代一個空陣列

JavaScript 中直接建立的陣列是鬆散的，以至於會有很多坑。試著用陣列的構造方法建立一個陣列，你就會明白我的意思。

 const arr = new Array(4);
[undefined, undefined, undefined, undefined]
複製程式碼

你會發現，通過一個鬆散的陣列去迴圈呼叫一些轉換是非常難的。

> const arr = new Array(4);
> arr.map((elem, index) => index);
[undefined, undefined, undefined, undefined]
複製程式碼

想要解決這個問題，你可以使用在建立新陣列的時候使用 Array.apply。

> const arr = Array.apply(null, new Array(4));
> arr.map((elem, index) => index);
[0, 1, 2, 3]
複製程式碼

2.給方法傳一個空引數

如果你想呼叫一個方法，並不填其中的一個引數時，JavaScript 就會報錯。

> method('parameter1', , 'parameter3');
Uncaught SyntaxError: Unexpected token ,
複製程式碼

一個人們常用的解決方法是傳遞 null 或 undefined.

> method('parameter1', null, 'parameter3') // or
> method('parameter1', undefined, 'parameter3');
複製程式碼

自從 JavaScript 把 null 當做一個 object 的時候， 我個人就不太喜歡使用它了。根據 ES6 中對擴充套件運算子的介紹，有一個更簡潔的方法可以將空引數傳遞給一個方法。正如前文所提到的，陣列是鬆散的，所以給它傳空值是可以的，我們正式用到了這個優點。

> method(...['parameter1', , 'parameter3']); // works!

3.陣列去重

我一直不明白為什麼陣列不提供一個內建函式可以讓我們方便的取到去重以後的值。擴充套件運算子幫到了我們，使用擴充套件運算子配合 Set Spread operators are here for the rescue. Use spread operators with the Set 可以生成一個不重複的陣列。

> const arr = [...new Set([1, 2, 3, 3])];
[1, 2, 3]
複製程式碼

相關文章