36장. 디스트럭처링(Destructuring) 할당

 

 

디스트럭처링 할당
(Destrcturing assignment)
:구조 분해 할당

구조화된 배열과 같은 이터러블 또는 객체를 비구조화( 또는 구조 파괴)하여
1개 이상의 변수에 개별적으로 할당하는 것을 말한다.

배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당할 때 유용

36.1 배열 디스트럭처링 할당

ES5

var arr = [1, 2, 3];

var one = arr[0];
var two = arr[1];
var three = arr[2];

console.log(one, two, three); //1, 2, 3

 

ES6

=> 배열 디스트럭처링 할당은 배열의 각 요소를 배열로부터 추출하여 1개 이상의 변수에 할당

이때,

배열 디스트럭처링 할당의 대상(할당문의 우변)은 이터러블이어야 한다.

할당 기준은 배열의 인덱스. 즉, 순서대로 할당된다.

 

const arr = [1, 2, 3];

const [one, two, three] = arr;

console.log(one, two, three); //1, 2, 3

 

36.2 객체 디스트럭처링 할당

ES5

var user = { firstName : 'Ungmo', lastName: 'Lee' };

var firstName = user.firstName;
var lastName = user.lastName;

console.log(firstNAme, lastName); // Ungmo Lee

 

ES6

=> 객체 디스트럭처링 할당은 객체의 각 프로퍼티를 객체로부터 추출하여 1개 이상의 변수에 할당한다.

이때 

객체 디스트럭처링 할당의 대상(할당문의 우변)은 객체이어야 하며,

할당 기준은 프로퍼티 키다. 즉 순서는 의미가 없고 선언된 변수 이름과 프로퍼티 키가 일치하면 할당된다.

 

const user = {firstName : 'Ungmo', lastName : 'Lee'};

const { lastName , firstName } = user;

console.log(firstName, lastName); // Ungmo Lee