ES6 문법 - 구조 분해 할당

배열 구조 분해

기본 변수 할당

let Tottenham = ['Son', 'Kane', 'Bale'];
let [son, kane, bale] = Tottenham;
console.log(son); // 'Son'
console.log(kane); // 'Kane'
console.log(bale); // 'Bale'

선언에서 분리한 할당

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

기본값

let a, b;
[a=5, b=7] = [1];
console.log(a); // 1
console.log(b); // 7

변수 값 교환하기

let a = 1;
let b = 3;
[a, b] = [b, a];
console.log(a); // 3
console.log(b); // 1

일부 반환 값 무시하기

const func = () => {
  return [1, 2, 3]
}
let [a, , b] = func();
console.log(a); // 1
console.log(b); // 3

변수에 배열의 나머지를 할당하기

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

객체 구조 분해

기본 할당

let obj = { a: 42, b: true };
let { a, b } = obj;
console.log(a); // 42
console.log(b); // true

선언 없는 할당

let a, b;
({a, b} = {a: 1, b: 2});
console.log(a) // 1
console.log(b) // 2

새로운 변수 이름을 할당하기

let obj = { a: 42, b: true };
let { a: num, b: bool } = obj;
console.log(num) // 42
console.log(bool) // true

기본값

let { a = 10, b = 5 } = { a: 3 };
console.log(a) // 3
console.log(b) // 5

기본값 갖는 새로운 이름의 변수에 할당하기

let { a: aa = 10, b: bb = 5 } = { a: 3 };
console.log(aa); // 3
console.log(bb);  // 5

계산된 속성 이름과 구조 분해

let key = 'z';
let { [key]: foo } = { z: 'Son' };
console.log(foo) // 'Son'

객체 구조 분해에서 Rest

let { a, b, ...rest } = { a: 10, b: 20, c: 30, d: 40 };
console.log(a) // 10
console.log(b) // 20
console.log(rest) // { c: 30, d: 40 }