[모던 자바스크립트 딥다이브] 36장 디스트럭처링 할당

 

디스트럭처링 할당 (destructuring assignment), 구조 분해 할당

• 구조화된 배열과 같은 이터러블 또는 객체를 비구조화하여 1개 이상의 변수에 개별적으로 할당하는 것
• 필요한 값만 추출해 변수에 할당할 때 유용함

 

배열 구조 분해 할당

• 배열 구조 분해 할당의 대상은 이터러블이어야 하며, 할당 기준은 배열의 인덱스임
• 순서대로 할당됨
• 변수의 개수와 이터러블의 요소의 개수가 반드시 일치할 필요는 없음
• 배열 구조 분해 할당을 위한 변수에 Rest 요소 사용 가능

const arr = [1,2,3];

const [one, two, three] = arr;
const [x, ...y] = arr;
console(x,y); // 1 [2,3]

 

 

 

객체 구조 분해 할당

• 각 프로퍼티를 객체로부터 추출해 1개 이상의 변수에 할당
• 할당 기준은 프로퍼티 키, 순서는 의미 없음
• Rest 프로퍼티 사용 가능

const user = { firstName : 'diago', lastName : 'Kim'};
const { lastName, firstName } = user;

const { lastName : ln, firstName : fn } = user;
console.log(fn, ln); // diago Kim

const {x, ...rest} = {x:1, t:2, y:3};