javascript es6 destructuring assignment ( 구조분해할당 )

Array나 Object의 자료를 꺼내 변수에 할당하는 경우는 많다. 손쉽게 할 수 있는 destructuring문법이 추가되었다.

    var [a, b, c, d = 0, e] = [1, 2, 3];
    console.log(a);
    console.log(b);
    console.log(c);
    console.log(d);
    console.log(e);

    var obj = {name: '이도', born: 1397, age: new Date().getFullYear() - 1397};
    console.log(obj);

    var {name} = obj;
    console.log(name);

    var {name, born, age = 100} = obj;
    console.log(name, born, age);

    var {name, born, age} = obj;
    console.log(name, born, age);

    var {name, born, age1} = obj;
    console.log(name, born, age1);

    //콜론은 '분해하려는 객체의 프로퍼티: 목표 변수’와 같은 형태
    var {name: callsign, born, age: age1} = obj;
    console.log(callsign, born, age1);

    var obj2 = {name: callsign, year: born, age1}
    console.log(obj2);

    fn({name, born, age});

    function fn({name,born}) {
        console.log(name);
        console.log(born);
    }

    fn2([name, born, age]);

    function fn2([name,born,age]) {
        console.log(name);
        console.log(born);
        console.log(age);
    }

d의 경우 default값을 설정한 것. e의 경우 할당을 안했으니 undefined가 출력된다.

Object의 경우 mustache를 사용하는데, default값은 object에 match 되는 key가 없을 때만 된다.

object의 key와 동일한 명을 사용해야 하나 variable name : new name형태로는 새로운 명칭을 줄 수 있다.

함수 파라미터로도 줄 수 있다. 세상 좋아졌네.

결과