React ES6スプレッド構文
スプレッド構文
JavaScriptスプレッド演算子(...)を使用すると、既存の配列またはオブジェクトのすべてまたは一部を別の配列またはオブジェクトにすばやくコピーできます。
例
const numbersOne = [1, 2, 3];
const numbersTwo = [4, 5, 6];
const numbersCombined = [...numbersOne, ...numbersTwo];
スプレッド演算子は多くの場合、分割代入と組み合わせて使用されます。
例
最初と 2 番目の項目をnumbers変数に代入し、残りを配列に入れます。
const numbers = [1, 2, 3, 4, 5, 6];
const [one, two, ...rest] = numbers;
オブジェクトでもスプレッド演算子を使用できます。
例
次の2つのオブジェクトを結合します。
const myVehicle = {
brand: 'Ford',
model: 'Mustang',
color: 'red'
}
const updateMyVehicle = {
type: 'car',
year: 2021,
color: 'yellow'
}
const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}
一致しないプロパティは結合されましたが、一致したプロパティはのcolorは、最後に渡されたupdateMyVehicleオブジェクトによって上書きされたことに注目してください。結果の色は黄色になりました。
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。