비구조화 할당(구조분해 할당)

ES6에서 도입된 문법이다. 호환성을 위해 사용하기 위해 babel과 같은 추가 작업이 필요하다.

 

배열 [1,2,3,4,5]에서 1,2를 a,b에 한번에 할당하고 싶다면 어떻게 해야할까?

const [a, b] = [1,2,3,4,5];

와 같이 사용하면 된다.

 

{ name: 'bob', age: 15, height: 170}이 있을 때 age의 값을 age 변수에 담으려면 어떻게 해야할까?

const {age} = { name: 'bob', age: 15, height: 170};

주의할 것은 속성 이름을 일치시켜줘야한다.

 

age 변수말고 my_age에 담으려면 어떻게 해야할까?

const {age: my_age} = { name: 'bob', age: 15, height: 170};

 

혹시 없을 경우를 대비해 기본 값을 사용하려면 어떻게 해야할까?

const {age: my_age, z = 5} = { name: 'bob', age: 15, height: 170};

 

다음과 같은 객체 obj가 있다고 하자.

{ 
 state : { 
    info:  { 
        name: 'bob'; 
    }, 
 value : 5; 
};

 

이 경우에 name:'bob'과 value:5 비구조화 할당을 어떻게 할까?

const {name} = obj.stat.info;

const {value} = obj.value;

 

한 번에 하려면 어떻게 할까?

const {
  state: {
    info:  {
      name
    }
  },
  value
} =  obj;

더 복잡해졌다.