JavaScript 스프레드 연산자 사용법

JavaScript의 스프레드 연산자는 배열과 객체를 다룰 때 매우 유용한 기능입니다. 스프레드 연산자를 사용하면 배열이나 객체의 요소를 간편하게 분해하거나 결합할 수 있습니다. 여기에서는 스프레드 연산자의 다양한 사용법을 자세히 알아보겠습니다.

1. 배열에서의 스프레드 연산자

배열 복사하기

배열을 복사할 때 스프레드 연산자를 사용하면 원본 배열을 변경하지 않고 새로운 배열을 생성할 수 있습니다.

const originalArray = [1, 2, 3];
const copiedArray = [...originalArray];
console.log(copiedArray); // [1, 2, 3]

배열 병합하기

여러 배열을 하나의 배열로 병합할 때도 스프레드 연산자를 사용할 수 있습니다.

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const mergedArray = [...array1, ...array2];
console.log(mergedArray); // [1, 2, 3, 4, 5, 6]

배열 요소 추가하기

기존 배열에 새로운 요소를 추가할 때 스프레드 연산자를 사용하면 간편합니다.

const numbers = [1, 2, 3];
const newNumbers = [0, ...numbers, 4];
console.log(newNumbers); // [0, 1, 2, 3, 4]

2. 객체에서의 스프레드 연산자

객체 복사하기

객체를 복사할 때도 스프레드 연산자를 사용하면 원본 객체를 변경하지 않고 새로운 객체를 생성할 수 있습니다.

const originalObject = { a: 1, b: 2 };
const copiedObject = { ...originalObject };
console.log(copiedObject); // { a: 1, b: 2 }

객체 병합하기

여러 객체를 하나의 객체로 병합할 때 스프레드 연산자를 사용할 수 있습니다.

const object1 = { a: 1, b: 2 };
const object2 = { c: 3, d: 4 };
const mergedObject = { ...object1, ...object2 };
console.log(mergedObject); // { a: 1, b: 2, c: 3, d: 4 }

객체 속성 추가하기

기존 객체에 새로운 속성을 추가할 때도 스프레드 연산자를 사용할 수 있습니다.

const user = { name: "John", age: 30 };
const updatedUser = { ...user, isAdmin: true };
console.log(updatedUser); // { name: "John", age: 30, isAdmin: true }

3. 함수 매개변수에서의 스프레드 연산자

스프레드 연산자를 사용하면 배열 요소를 개별 매개변수로 쉽게 전달할 수 있습니다.

const numbers = [1, 2, 3, 4];

function sum(a, b, c, d) {
  return a + b + c + d;
}

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

스프레드 연산자를 사용하면 코드의 가독성이 향상되고, 배열과 객체를 더 쉽게 조작할 수 있습니다. 다양한 상황에서 스프레드 연산자를 활용하여 효율적인 코드를 작성해보세요.