Destructuring 할당

구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다.

let a, b;
[a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20

[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest); // [30, 40, 50]

({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}

let x = [1, 2, 3, 4, 5];
let [y, z] = x;
console.log(y); // 1
console.log(z); // 2

배열 구조 분해

기본 변수 할당

let temp = ['apple','banana','orange']
let [temp1, temp2, temp3] = temp;
console.log(temp1);
console.log(temp2);
console.log(temp3);

기본값

변수에 기본값을 할당하면, 분해한 값이 underfined일 때 그 값을 대신 사용합니다.

let a, b;

[a=10, b=20] = [20];
console.log(a); // 20
console.log(b); // 20

변수 값 교환하기

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

함수의 리턴 배열 분석

const temp = () => ([1, 2]);
혹은
function temp() {
	return [1,2];
}

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

일부 리턴값 무시

const temp = () => ([1,2,3]);

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

객체 구조 분해

기본 할당

let o = { birth: '000101', lover:false};
let {bt, lv} = o;

console.log(bt); // '000101'
console.log(lv); // false

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

var temp = { age : 26, lover:true };
var { age:myAge, lover: status} = temp;

console.log(myAge) // 26
console.log(status) // true