スプレッド構文とは

ECMAScript 2015 で定義された構文。

関数呼び出しでは 0 個以上の引数として、Array リテラルでは 0 個以上の要素として、
Object リテラルでは 0 個以上の key-value のペアとして、Array や String などの iterable オブジェクトをその場で展開する

example.js
// Array
const odd = [1, 3]
const even = [2, 4]
const numbers = [...odd, ...even]
console.log(numbers) // [1, 3, 2, 4]

//Object
const name = {first: "Tanaka", last: "Taro"}
const age = {age: 27}
const profile = {...name, ...age}
console.log(profile) // {first: "Tanaka", last: "Taro", age: 27}

配列やオブジェクトをコピーするだけでなく、マージすることが簡単にできる。
配列であれば hoge.concat()
オブジェクトであれば、 Object.asign()
を使い実現していたことを、短い記述で同様のことを実現できる。

example.js
// Array
const numbers = odd.concat(even)

// Object
const profile = Object.assign(name, age)

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_syntax external_link