展開演算子 (...)

JavaScriptで三点演算子（...)、展開演算子とも呼ばれます。

展開演算子（spread operator）

JavaScriptの展開演算子 (...) は、可迭代なオブジェクト（例えば配列）をさらに要素に拡張します。

これにより、既存の配列の全部または一部を別の配列に素早くコピーできます：

インスタンス

JavaScriptの展開演算子を使用して2つの配列を統合します

const numbersOne = [1, 2, 3];
const numbersTwo = [4, 5, 6];
const numbersCombined = [...numbersOne, ...numbersTwo];

自分で試してみてください

展開演算子は、配列から必要な部分を抽出するのによく使用されます：

インスタンス

numbers配列の最初の要素と2番目の要素を変数に割り当て、残りを別の配列に格納します：

const numbers = [1, 2, 3, 4, 5, 6];
const [one, two, ...rest] = numbers;

自分で試してみてください

オブジェクト上でも展開演算子を使用できます：

インスタンス

const myVehicle = {
  brand: 'Ford',
  model: 'Mustang',
  color: 'red'
}
const updateMyVehicle = {
  type: 'car',
  year: 2021,
  color: 'yellow'
}
const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}

自分で試してみてください

不適合の属性は統合されましたが、一致する属性 color 最後に渡されたオブジェクト updateMyVehicle カバーされました。最終的な色は黄色です。

関連ページ

チュートリアル：JavaScript ES6