JavaScript는 스프레드 연산자(…)를 제공하여 배열과 객체를 다루는 데 매우 유용한 기능을 제공합니다. 스프레드 연산자는 코드를 간결하게 작성하고 가독성을 높이는 데 도움이 되며, 배열과 객체를 복사, 병합, 수정하는 등 다양한 작업에 활용됩니다. 이 블로그 포스팅에서는 스프레드 연산자의 활용 방법과 예시를 살펴보겠습니다.
배열에서 스프레드 연산자 사용
1. 배열 복사 (Shallow Copy)
배열을 복사하려면 스프레드 연산자를 사용할 수 있습니다. 이렇게 복사한 배열은 원본 배열과는 다른 메모리 주소를 가지며, 하나의 배열을 수정해도 다른 배열은 영향을 받지 않습니다.
const originalArray = [1, 2, 3];
const copyArray = [...originalArray];2. 배열 병합
스프레드 연산자를 사용하여 두 개 이상의 배열을 하나로 병합할 수 있습니다.
const array1 = [1, 2];
const array2 = [3, 4];
const mergedArray = [...array1, ...array2]; // [1, 2, 3, 4]3. 배열 요소 추가 및 삭제
스프레드 연산자를 사용하여 배열에 새로운 요소를 추가하거나 삭제할 수 있습니다.
const originalArray = [1, 2];
const newArray = [...originalArray, 3]; // 요소 추가: [1, 2, 3]
const removedArray = [...originalArray.slice(0, 1), ...originalArray.slice(2)]; // 요소 삭제: [2]객체에서 스프레드 연산자 사용
1. 객체 복사 (Shallow Copy)
객체를 복사하려면 스프레드 연산자를 사용할 수 있습니다. 이렇게 복사한 객체는 원본 객체와는 다른 메모리 주소를 가지며, 하나의 객체를 수정해도 다른 객체는 영향을 받지 않습니다.
const originalObject = { name: 'Alice', age: 30 };
const copyObject = { ...originalObject };2. 객체 병합
스프레드 연산자를 사용하여 두 개 이상의 객체를 하나로 병합할 수 있습니다. 이때, 중복된 키가 있으면 나중에 오는 객체의 값이 이전 객체의 값을 덮어씁니다.
const object1 = { name: 'Alice' };
const object2 = { age: 30 };
const mergedObject = { ...object1, ...object2 }; // { name: 'Alice', age: 30 }함수 인자에서 스프레드 연산자 사용
함수의 매개변수에서 스프레드 연산자를 사용하여 가변 인자(variable arguments)를 처리할 수 있습니다.
function sum(...numbers) {
return numbers.reduce((acc, num) => acc + num, 0);
}
const result = sum(1, 2, 3, 4, 5); // 15결론
JavaScript의 스프레드 연산자는 배열과 객체를 다루는 데 강력한 기능을 제공합니다. 이를 활용하면 코드를 더 간결하게 작성하고 다양한 작업을 효율적으로 수행할 수 있습니다. 배열과 객체를 다루는 개발 작업에서는 스프레드 연산자를 활용하여 생산성을 향상시킬 수 있으니 적극적으로 활용해보세요.