객체 Destructuring

객체 Destructuring을 사용하면 객체의 속성을 변수로 추출할 수 있습니다. 다음은 객체 Destructuring의 예시입니다.

const person = {
  name: 'John',
  age: 30,
  city: 'New York'
};

const { name, age } = person;

console.log(name); // 'John'
console.log(age); // 30

위의 코드에서 person 객체에서 name과 age 속성을 추출하여 변수로 할당하였습니다. 이렇게 하면 person.name과 person.age를 직접 참조하는 대신 변수를 사용하여 해당 값을 사용할 수 있습니다.

또한, Destructuring 할당을 사용하여 변수의 기본값을 설정할 수도 있습니다.

const person = {
  name: 'John',
  age: 30
};

const { name, city = 'Unknown' } = person;

console.log(name); // 'John'
console.log(city); // 'Unknown'

위의 코드에서 person 객체의 city 속성은 존재하지 않기 때문에 Destructuring 할당 시 기본값으로 ‘Unknown’이 설정되었습니다.

배열 Destructuring

배열 Destructuring을 사용하면 배열의 요소를 변수로 추출할 수 있습니다. 다음은 배열 Destructuring의 예시입니다.

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

const [first, second] = numbers;

console.log(first); // 1
console.log(second); // 2

위의 코드에서 numbers 배열에서 첫 번째와 두 번째 요소를 추출하여 변수로 할당하였습니다. 마찬가지로 배열 Destructuring 할당을 사용하여 변수의 기본값을 설정할 수도 있습니다.

const numbers = [1, 2];

const [first, second = 0, third = 0] = numbers;

console.log(first); // 1
console.log(second); // 2
console.log(third); // 0

위의 코드에서 numbers 배열에는 세 번째 요소가 없기 때문에 변수 third의 기본값인 0이 할당되었습니다.

Destructuring을 사용하면 불필요한 코드를 줄이고 필요한 값만 추출하여 사용할 수 있습니다. 객체 또는 배열 Destructuring을 통해 자바스크립트 코드를 더욱 간결하고 가독성 있게 작성해보세요.

#javascript #Destructuring