1.Array.from()
Array.from方法用於將兩類對象轉為真正的數組:類似數組的對象和可遍歷(iterable)對象。
下面是一個類似數組的對象,Array.from將它轉為真正的數組。
只要是部署了Iterator接口的數據結構,Array.from都能將其轉為數組。
以上代碼中,字符串和Set結構都具有Iterator接口,因此可以被Array.from轉為真正的數組。
對於還沒有部署該方法的瀏覽器,可以用Array.prototype.slice方法替代:
const toArray = (() => Array.from ? Array.from : obj => [].slice.call(obj))();
Array.from還可以接受第二個參數,作用類似於數組的map方法,用來對每個元素進行處理,將處理后的值放入返回的數組。
Array.from(arrayLike, x => x * x); // 等同於
Array.from(arrayLike).map(x => x * x);
2.Array.of()
Array.of方法用於將一組值轉換為數組。
這個方法的主要目的是彌補數組構造函數Array()的不足。基本上可以用來替代Array()或者new Array(),並且不存在由參數不同而導致的重載。
3.copyWithin()
數組實例的copyWithin方法,在當前數組內部將指定位置的成員復制到其他位置(會覆蓋原有成員),然后返回當前數組。
Array.prototype.copyWithin(target, start = 0, end = this.length)
它接受3個參數。
● target(必需):從該位置開始替換數據
● start(可選):從該位置開始讀取數據,默認為0。如果為負值,表示倒數
● end(可選):到該位置前停止讀取數據,默認等於數組長度。如果為負值,表示倒數
這3個參數都應該是數值,如果不是,會自動轉換為數值。
上面代碼表示將從3號位置直到數組結束的成員(4和5)復制到從0號位置開始的位置,結果覆蓋了原來的1和2。
對於沒有部署TypeArray的copyWithin方法的平台,需要采用下面的寫法:
4. 數組實例的find()和findIndex()
數組實例的find()方法,用於找出第一個符合條件的數組成員。它的參數是一個回調函數,所有數組成員依次執行該回調函數,直到找出第一個返回值為true的成員,然后返回該成員。如果沒有符合條件的成員,則返回undefined。
上面的代碼找出數組中第一個小於0的成員。
上面的代碼中,find方法的回調函數可以接受3個參數,依次為當前的值、當前的位置和原數組。
數組實例的findIndex方法的用法與find方法非常類似,返回第一個符合條件的數組成員的位置,如果所有成員都不符合條件,則返回-1。
5.數組實例的fill()
fill方法使用給定值填充數組。
上面的代碼表明,fill方法用於空數組的初始化非常方便。數組中已有的元素會被全部抹去。fill方法還接受第二個和第三個參數,用於指定填充的起始位置和結束位置。
上面的代碼表示,fill方法從1號位置開始,向原數組填充7,到2號位置之前結束。
6.數組實例的entries()、keys()和values()
ES6提供了3個新方法——entries()、keys()和values()——用於遍歷數組。它們都返回一個遍歷器對象,可用for...of循環遍歷,唯一的區別是:keys()是對鍵名的遍歷,values()是對鍵值的遍歷,entries()是對鍵值對的遍歷。
7.數組實例的includes()
Array.prototype.includes方法返回一個布爾值,表示某個數組是否包含給定的值,與字符串的includes方法類似。該方法屬於ES7,但Babel轉碼器已經支持。
該方法的第二個參數表示搜索的起始位置,默認為0。如果第二個參數為負數,則表示倒數的位置,若此位置超出數組長度,則會重置從0開始。
沒有該方法時,通常使用indexOf方法檢查是否包含某個值,但是indexOf方法有兩個缺點:一是不夠語義化,其含義是找到參數值的第一個出現位置,所以要比較是否不等於-1,表達起來不夠直觀;二是其內部使用嚴格相當運算符(===)進行判斷,會導致NaN的誤判。
對於沒有部署該方法的平台,可以使用以下代碼:
8.數組的空位
數組的空位指數組的某一個位置沒有任何值。ES5會忽略空位,而ES6明確將空位轉為undefined,不會忽略。
- Array.from()會將空位轉為undefined
- 擴展運算符(...)也會將空位轉為undefined
- copyWithin()會將空位一起復制
- fill()會將空位視為正常的位置
- for...of循環也會遍歷空位
上面的代碼中,數組arr有兩個空位,for...of並沒有忽視它們。如果改成map方法則會跳過空位。
- entries()、keys()、values()、find()和findIndex()會將空位處理成undefined
由於空位的處理非常不統一,因此建議避免出現空位。