1. distructuring assignment?

• 디스트럭처링 할당(distructuring assignment, 구조분해할당)은 구조화된 배열과 같은 이터러블 또는 객체를 destructuring(비구조화, 구조파괴)하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다.
• 배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당할 때 유용하다.

⭐ 참고 이터러블(interable)?
→ 자료를 반복할 수 있는 객체를 말하는 것이다. 우리가 흔히 쓰는 배열 역시 이터러블 객체이다.

---

2. 배열 디스트럭처링 할당

• 배열 디스트럭처링 할당을 위해서는 할당 연산자 왼쪽에 값을 할당받을 변수를 선언해야 한다.
• 변수는 배열 리터럴 형태로 선언한다.

// ES5의 경우
var arr = [1, 2, 3];

var one = arr[0];
var two = arr[1];
var three = arr[2];

console.log(one, two, three); // 1, 2, 3

// ES6의 경우
// 변수 one, two, three를 선언하고 배열 arr을 디스트럭처링하여 할당한다.
// 이때 할당 기준은 배열의 인덱스다.
const arr = [1, 2, 3];

const [one, two, three] = arr;

console.log(one, two, three); // 1 2 3

• 우변에 이터러블을 할당하지 않으면 에러가 발생한다.

// 에러가 나는 경우
const [x, y];

const [a, b] = {}; // TypeError: {}is not iterable

• 배열 디스트럭처링 할당의 기준은 배열의 인덱스이다. → 순서대로 할당된다.

const [a, b] = [1, 2];
console.log(a, b); // 1 2

const [c, d] = [1];
console.log(c, d); // 1 undefined

const [e, f] = [1, 2, 3];
console.log(e, f); // 1 2

const [g, , h] = [1, 2, 3];
console.log(g, h); // 1 3

• 배열 디스트럭처링 할당을 위한 변수에 기본값을 설정할 수 있다.

// 기본값
const [a, b, c = 3] = [1, 2];
console.log(a, b, c); // 1 2 3

// 기본값보다 할당된 값이 우선된다.
const [e, f = 10, g = 3] = [1, 2];
console.log(e, f, g); // 1, 2, 3

---

3. 객체 디스트럭처링 할당

• ES5에서 객체의 각 프로퍼티를 객체로부터 디스트럭처링하여 변수에 할당하기 위해서는 프로퍼티 키를 사용해야 한다.
• ES6의 객체 디스트럭처링 할당의 대상은 객체이어야 하며, 할당 기준은 프로퍼티 키다.
• 순서는 의미가 없으며 선언된 변수 이름과 프로퍼티 키가 일치하면 할당된다.

// ES5
var user = { name: "Kim", age: 29 }

var name = user.name;
var age = user.age;

console.log(name, age); // Kim 29

// ES6
const user = { name: "Kim", age: 29 }
const { name, age } = user;

console.log(name, age); // Kim 29

• 우변에 객체 또는 객체로 평가될 수 있는 표현식(문자열, 숫자, 배열 등)을 할당하지 않으면 에러가 발생한다.

// 에러가 나는 경우
const { name, age };
const { name, age } = null;

• 객체의 프로퍼티 키와 다른 변수 이름으로 프로퍼티 값을 할당받을 수 있다.

const user = { name: "Kim", age: 29 };
const { name: n, age: a } = user;

console.log(n, a); // Kim 29

• 객체 디스트럭처링 할당을 위한 변수에 기본값을 설정할 수 있다.

const { name: "Kim", age } = { age: 29 };
console.log(name, age); // Kim 29

...