擴展運算符將一個數組轉為用逗號分隔的參數序列
console.log(...[a, b, c]) // a b c
用於:
1 將一個數組,變為參數序列
let add = (x, y) => x + y; let numbers = [3, 45]; console.log(add(...numbers))//48
2 使用擴展運算符展開數組代替apply方法,將數組轉為函數的參數
//ES5 取數組最大值 console.log(Math.max.apply(this, [654, 233, 727])); //ES6 擴展運算符 console.log(Math.max(...[654, 233, 727])) //相當於 console.log(Math.max(654, 233, 727))
3 使用push將一個數組添加到另一個數組的尾部
// ES5 寫法 var arr1 = [1, 2, 3]; var arr2 = [4, 5, 6]; Array.prototype.push.apply(arr1, arr2);
//push方法的參數不能是數組,通過apply方法使用push方法 // ES6 寫法 let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6]; arr1.push(...arr2);
4 合並數組
var arr1 = ['a', 'b']; var arr2 = ['c']; var arr3 = ['d', 'e']; // ES5 的合並數組 arr1.concat(arr2, arr3); // [ 'a', 'b', 'c', 'd', 'e' ] // ES6 的合並數組 [...arr1, ...arr2, ...arr3] // [ 'a', 'b', 'c', 'd', 'e' ]
5 將字符串轉換為數組
[...'hello'] // [ "h", "e", "l", "l", "o" ] //ES5 str.split('')
6 轉換偽數組為真數組
var nodeList = document.querySelectorAll('p'); var array = [...nodeList];
//具有iterator接口的偽數組,非iterator對象用Array.from方法
7 map結構
let map = new Map([ [1, 'one'], [2, 'two'], [3, 'three'], ]); let arr = [...map.keys()]; // [1, 2, 3]