ES6 - 數組擴展(擴展運算符)


擴展運算符

擴展運算符(spread)是三個點(...)。它好比 rest 參數的逆運算(函數),將一個數組轉為用逗號分隔的參數序列。

rest: 變量將多余的參數放入數組中。
spread(擴展):rest 參數的逆運算,將一個數組轉為用逗號分隔的參數序列。
總結:二者為逆操作。

console.log(...[1, 2, 3])
// 1 2 3

該運算符主要用於函數調用。

/**
 * 1.該運算符將一個數組,變為參數序列。
 */
function add(x, ...y) {
  // x = 10 , ...y = [4,38]
  return x + y.reduce((sum, num) => {
    return sum + num;
  })
}

const numbers = [4, 38];
console.log(add(8,...numbers));  //50


/**
 * 2.擴展運算符與正常的函數參數可以結合使用,非常靈活。
 */
function f(v, w, x, y, z) {
  // v = -1, 
  // w = 0,x = 1,
  // y = 2,z = 3
}
const args = [0, 1];
var arr = f(-1, ...args, 2, ...[3]);

console.log(arr);  // 42

/**
 * 3.替代push
 */
// ES5的 寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
console.log(arr1); //(6) [0, 1, 2, 3, 4, 5]

// ES6 的寫法
let arr3 = [0, 1, 2];
let arr4 = [3, 4, 5];
arr3.push(...arr4);
console.log(arr3); //(6) [0, 1, 2, 3, 4, 5]


參考:

阮一峰 - ES6入門 - 擴展運算符


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM