[JavaScript] 구조분해할당 (Destructuring Assignment)

HYl·2022년 3월 16일
0

구조분해 할당 ( Destructuring Assignment )

객체 내부의 속성과 할당하는 변수명이 같을 때 코드를 줄여 사용할 수 있다.

객체 구조분해 할당

// 기존 코드
const body = document.body;
const createElement = document.createElement;

// 구조분해 할당
const { body, createElement } = document;

여러 줄에 걸쳐 할당하는 코드를 한 줄로 줄일 수 있어서 편리하다.


배열 구조분해 할당

  • 자리 수가 같아야 한다 !
const array = [1, 2, 3, 4, 5];

// 기존 코드
const one = array[0];
const two = array[1];
const three = array[2];
const four = array[3];
const five = array[4];

// 구조분해 할당 
const [one, two, three, four, five] = array;
console.log(one, two, three, four, five); // 1 2 3 4 5

const [one,, three,, five] = array;
console.log(one, three, five); // 1 3 5

const object = {
	one: '1',
    two: {
    	three: '3',
        four: { five: '5' },
    },
};

// one, three, five 를 구조분해 할당 한다면?
const { one, two: { three, four: { five } } } = object;
console.log(one, three, five); // 1, 3, 5

REFERENCE

profile
꾸준히 새로운 것을 알아가는 것을 좋아합니다.

0개의 댓글