7. destructuring

딱히 설명할 것이 없어서 샘플코드로만 대체하려 한다.

 변수를 특정 구조에 맞게 작성하고, 그에 따른 구조에 맞게 값을 할당하면 그 모습 그대로 들어간다는 것을 보면 될듯하다.

Sample

Array Matching

let values = [1,2,3];

let one, two;

[one, two] = [values];
console.log(one+ ',' + two);
//1, 2 가 출력
let three, four;
[one, two, three, four] = [values];
console.log(one+ ',' + two+ ',' + three+ ',' + four);
//1,2,3,undefined 가 출력 
[one, two, [three, four]] = [1,2, [73, 74]];
[one, , three, ...spd] = [1,2,3,4,5];
//one == 1
// three == 3
// spd = [4,5]

Object Matching

let {one, two} = {one: 10, two : 20 };
let three, four;
({three, four} = {three:3, four: 4});
//프로퍼티 이름을  별도로  선언한 경우
//소괄호() 안에 변수 이름과 표현식 작성 
let five, six;
({one:five, two:six} = {one:5, two:6});
//five == 5, six == 6

let {nine, plus:{ten}} = {nine:9, plus:{ten:10}};

Parameter Context Matching

function f ([ name, val ]) {
    console.log(name, val)
}
function g ({ name: n, val: v }) {
    console.log(n, v)
}
function h ({ name, val }) {
    console.log(name, val)
}
f([ "bar", 42 ])
g({ name: "foo", val:  7 })
h({ name: "bar", val: 42 })