Destructuring을 사용하여 자바스크립트에서 객체 속성 분리하기
자바스크립트에서 객체 속성을 분리하는 방법은 여러 가지가 있습니다. 그 중 하나는 객체 비구조화 할당(destructuring assignment)을 사용하는 것입니다. 이를 통해 객체의 속성을 변수에 할당할 수 있습니다.
객체의 속성 분리하기
다음은 객체의 속성을 분리하는 예제입니다.
const user = {
name: "John",
age: 30,
email: "john@example.com"
};
const { name, age, email } = user;
console.log(name); // "John"
console.log(age); // 30
console.log(email); // "john@example.com"
위의 코드에서 user
객체의 속성을 name
, age
, email
변수에 분리하여 할당하였습니다. 이제 각 변수에 해당하는 값에 접근할 수 있습니다.
기본값 설정하기
객체의 속성을 분리할 때, 해당 속성의 값이 undefined
인 경우 기본값을 설정할 수도 있습니다.
const user = {
name: "John",
age: 30
};
const { name, age, email = "N/A" } = user;
console.log(name); // "John"
console.log(age); // 30
console.log(email); // "N/A"
위의 코드에서 email
속성은 undefined
이므로, 기본값인 “N/A”가 할당되었습니다.
중첩된 객체의 속성 분리하기
객체의 속성이 중첩된 경우에도 비구조화 할당을 사용하여 속성을 분리할 수 있습니다.
const user = {
name: "John",
age: 30,
address: {
city: "Seoul",
country: "South Korea"
}
};
const { name, age, address: { city, country } } = user;
console.log(name); // "John"
console.log(age); // 30
console.log(city); // "Seoul"
console.log(country); // "South Korea"
위의 코드에서 user
객체의 address
속성은 중첩된 객체입니다. 이 중첩된 객체의 속성을 city
와 country
변수에 분리하여 할당하였습니다.
요약
여기서는 객체 비구조화 할당을 사용하여 자바스크립트에서 객체 속성을 분리하는 방법을 살펴보았습니다. 이를 통해 코드를 더 간결하게 작성할 수 있고, 객체의 속성을 빠르게 액세스할 수 있습니다. 비구조화 할당은 ES6에서 도입된 기능이므로 현대적인 자바스크립트 환경에서 사용할 수 있습니다.
#JavaScript #객체분리 #비구조화할당