スプレッド構文 - yamaScrapbox

スプレッド構文

関数

apply を置き換える

code:sample1-1.js

function sum(x, y, z) {

return x + y + z;

}

const numbers = 1, 2, 3;

console.log(sum(...numbers));

// expected output: 6

console.log(sum.apply(null, numbers));

// expected output: 6

new 演算子と併用

コンストラクタの引数として使える

code:sample1-2.js

const dateFields = 1970, 0, 1;

const d = new Date(...dateFields);

// Thu Jan 01 1970 00:00:00 GMT+0900 (日本標準時)

配列

複製する

code:sample2-1.js

const arr = 1, 2, 3;

const arr2 = ...arr; // arr.slice();

console.log(arr2.push(4));

// Array 1, 2, 3, 4

連結する

code:sample2-2.js

let arr1 = 0, 1, 2;

let arr2 = 3, 4, 5;

console.log(arr1 = ...arr1, ...arr2);

// Array 0, 1, 2, 3, 4, 5

分割する

code:sample2-3.js

let a, b, ...other = 1, 2, 3, 4, 5;

console.log(a); // 1

console.log(b); // 2

console.log(other); // 3, 4, 5

重複を除く

code:sample2-4.js

const data = 'a', 'b', 'c', 'a', 'b', 'd';

const dist = ...(new Set(data));

console.log(dist); // "a","b","c","d"

Object リテラル

Object.assign() を使うよりも短いコード

code:sample4.js

const obj1 = { foo: 'bar', x: 42 };

const obj2 = { foo: 'baz', y: 13 };

const clonedObj = { ...obj1 };

// Object { foo: "bar", x: 42 }

const mergedObj = { ...obj1, ...obj2 };

// Object { foo: "baz", x: 42, y: 13 }

#JavaScript #ES6 #ES2015