[Javascript] 전개 연산자(Spread Operator)

● 전개 연산자(Spread Operator)

  - JavaScript에서 데이터를 확장하거나 복사할 때 사용

  - 주로 배열과 객체를 다룰 때 사용

  - ES6 (ECMAScript 2015) 문법

  - "[Javascript] 배열 합치는 방법 5가지(concat, spread, push, Array.from, reduce)" 에서 소개된 문법

 

● 배열에서의 전개 연산자 예시

  1. 배열 병합 

 

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const mergedArray = [...arr1, ...arr2]; // [1, 2, 3, 4, 5, 6]

const arr3 = [7, 8, 9];
const mergedArray2 = [...arr1, ...arr2, ...arr3]; // [1, 2, 3, 4, 5, 6, 7, 8, 9]

 

  2. 배열 복사

 

const originalArray = [1, 2, 3];
const copiedArray = [...originalArray]; // [1, 2, 3]

 

  3. 배열 요소 추가 및 수정

 

const numbers = [1, 2, 3];
const updatedNumbers = [...numbers, 4, 5]; // [1, 2, 3, 4, 5]

 

● 오브젝트에서의 전개 연산자 예시

  1. 오브젝트 병합

 

const firstObject = { x: 1, y: 2 };
const secondObject = { y: 3, z: 4 };
const mergedObject = { ...firstObject, ...secondObject }; // {x: 1, y: 3, z: 4}

 

  2. 오브젝트 복사

 

const originalObject = { x: 1, y: 2 };
const copiedObject = { ...originalObject }; // {x: 1, y: 2}

 

  3. 오브젝트 속성 추가 및 수정

 

const originalObject = { x: 1, y: 2 };
const copiedObject = { ...originalObject }; // { x: 1, y: 2 }