ES6에서 새로 도입한 해체 할당!
이 기능은 객체나 배열을 변수로 해체할 수 있다.
// 객체 선언
const obj = { b: 2, c: 3, d: 4};
// 해체 할당
const {a, b, c} = obj;
a; // undefined: obj에는 "a"의 프로퍼티가 없다.
b; // 2
c; // 3
d; // ReferenceError: "d"는 정의되지 않았다.
객체를 해체할 때는 반드시 변수 이름과 객체의 프로퍼티 이름이 일치해야 한다. 프로퍼티 이름이 유효한 식별자인 프로퍼티만 해체 후 할당된다.
객체 해체는 할당만으로도 이뤄질 수 있다. 하지만 그렇게 하려면 반드시 괄호를 써야 한다.
const obj = { b: 2, c: 3, d: 4 };
let a, b, c;
// 에러
{a, b, c} = obj;
// 동작
({a, b, c} = obj);
배열을 해체할 때는 배열 요소에 대응할 변수 이름을 마음대로 쓸 수 있고, 이는 배열 순서대로 대응한다.
// 배열 선언
const arr = [1, 2, 3];
// 배열 해체 할당 -> 남은 배열 요소는 버려짐
let [x, y] = arr;
x; // 1
y; // 2
z; // ReferenceError: "z"는 정의되지 않았다.
// 확산 연산자 사용하여 남은 요소를 새 배열에 할당
const arr1 = [1, 2, 3, 4, 5];
let [a, b, ...rest] = arr1;
x; // 1
y; // 2
rest; // [3, 4, 5]