구조분해 할당 ( Destructuring Assignment )
객체 내부의 속성과 할당하는 변수명이 같을 때 코드를 줄여 사용할 수 있다.
// 기존 코드
const body = document.body;
const createElement = document.createElement;
// 구조분해 할당
const { body, createElement } = document;
여러 줄에 걸쳐 할당하는 코드를 한 줄로 줄일 수 있어서 편리하다.
const array = [1, 2, 3, 4, 5];
// 기존 코드
const one = array[0];
const two = array[1];
const three = array[2];
const four = array[3];
const five = array[4];
// 구조분해 할당
const [one, two, three, four, five] = array;
console.log(one, two, three, four, five); // 1 2 3 4 5
const [one,, three,, five] = array;
console.log(one, three, five); // 1 3 5
const object = {
one: '1',
two: {
three: '3',
four: { five: '5' },
},
};
// one, three, five 를 구조분해 할당 한다면?
const { one, two: { three, four: { five } } } = object;
console.log(one, three, five); // 1, 3, 5