구조분해 할당 / ES2015 & ES6 - 05

구조분해 할당은 책만 보고는 쉽게 이해가 어려웠다 

유툽 참고해서 내용을 이해하고 책을 봤다

// * 구조분해 할당

// - 객체와 배열에서 속성이나 요소를 쉽게 꺼낼 수 있다

// * 구조분해 할당 쉬운 예시

let users = ['Mike', 'Tom', 'Jane'];
let [user1, user2, user3] = users;
/*
let user1 = users[0];
let user2 = users[1];
let user3 = users[2];
과 같다
*/
let str = "Mike-Tom-Jane";
let [user4, user5, user6] = str.split('-');

console.log(`${user1} ${user2} ${user3} / ${user4} ${user5} ${user6}`);
// Mike Tom Jane / Mike Tom Jane

// * 기본값 할당
let [a,b,c] = [1,2];
// c는 undefiend
let [d=3, e=4, f=5] = [1,2];
console.log(`${a} ${b} ${c} / ${d} ${e} ${f}`);
//1 2 undefined / 1 2 5

 

// * 객체의 구조분해

let user = {name: 'Mike', age: 30};
let {name, age} = user; //let {age, name} = user; 순서 상관 없음
let {name: userName, age: userAge} = user; // 이름도 변경 가능함
/*
let name = user.name;
let age = user.age;
*/

// * 기본값
let user0 = {name: 'Mike', age:30};
//let {name2, age2, gender} = user0;
let {name2, age2, gender  = 'male'} = user0; //기본값 할당

 

// 구조분해 할당 문법

// 기존 사용 문법은
var array = ['nodejs', {}, 10, true];
var node = array[0];
var obj = array[1];
var bool = array[3];
// 이렇게 만든 다음에 값을 대입했음


// 지금은 간단하게
const array = ['nodejs', {}, 10, true];
const [node, obj,  , bool] = array;

 

//////
var candyMachine = {
    status : {
        name: 'node',
        count: 5,
    },
    getCandy: function (){
        this.status.count--;
        return this.status.count;
    },
};
var getCandy = candyMachine.getCandy;
var count =  candyMachine.status.count;

// 아래 처럼 사용이 가능해졌다

const candyMachine2 = {
    status2 : {
        name2: 'node',
        count2: 5,
    },
    getCandy2(){
        this.status2.count--;
        return this.status2.count;
    },
}
const { getCandy2 , status2 : { count2 } } = candyMachine2;

 

다른 유툽 내용 보고 확인하니 이전에 내가 썼던 코드들을 더 쉽고 간편하게 만들어주는 기능들이였고

이 기능을 쓰지 않으면 코드도 길어지고 피로도가 더 길어진다... (이미 이전에 사용했던 방법들)

옛날 코드들에 배열값을 하나하나 저장해서 사용하는데 이제 그러지 않아도 될 듯 하다...

아는 만큼 편해지는게 코드구나 싶었다