자바스크립트 객체 확장 (Object Spread)

09 Sep 2023

javascript

자바스크립트는 ES6부터 객체 확장 (Object Spread) 문법을 도입했습니다. 이는 객체를 복사하고 확장하는 간단하고 강력한 방법을 제공합니다.

객체 확장 (Object Spread)이란 무엇인가요?

객체 확장 (Object Spread)은 기존 객체의 속성을 새로운 객체에 복사하고 추가적인 속성을 할당하는 데 사용되는 문법입니다. Spread 연산자인 ...를 사용하여 객체 속성을 펼칠 수 있습니다. 이를 통해 기존 객체를 변경하지 않고 새로운 객체를 생성할 수 있습니다.

예제 코드

아래 예제 코드를 통해 객체 확장 (Object Spread)을 사용하는 방법을 살펴보겠습니다.

const person = {
  name: "John",
  age: 25,
};

const updatedPerson = {
  ...person,
  city: "New York",
};

console.log(updatedPerson);

위의 코드에서는 person 객체를 ...person과 같이 Spread 연산자를 사용하여 펼칩니다. 이를 사용하여 person 객체의 속성을 updatedPerson 객체에 복사합니다. 그리고 추가적인 city 속성을 할당하여 새로운 객체를 생성합니다.

결과는 다음과 같습니다:

{
  name: "John",
  age: 25,
  city: "New York",
}

주의사항

객체 확장 (Object Spread)을 사용할 때 몇 가지 주의사항이 있습니다.

중복된 속성이 있는 경우: Spread 연산자를 사용하여 객체를 확장할 때, 중복된 속성이 있는 경우 나중에 오는 속성이 덮어쓰게 됩니다.
깊은 복사가 되지 않음: 객체 내의 중첩된 객체나 배열은 깊은 복사가 이루어지지 않습니다. Spread 연산자는 단순히 레퍼런스를 복사하기 때문에 원래 객체의 중첩된 객체나 배열이 변경될 경우, 복사된 객체도 함께 변경됩니다.

마무리

자바스크립트의 객체 확장 (Object Spread) 문법은 객체를 쉽게 복사하고 확장하는 데 유용한 기능입니다. 기존 객체를 변경하지 않고 새로운 객체를 생성하는 데 사용할 수 있으며, 코드의 가독성과 유지 보수성을 향상시킬 수 있습니다. 하지만 중복된 속성과 깊은 복사에 주의해야 합니다.

최신 버전의 자바스크립트에서는 객체 확장 (Object Spread) 문법을 자유롭게 사용하여 보다 효율적이고 간결한 코드를 작성할 수 있습니다.