디스트럭처링: 이터러블, 혹은 객체 리터럴에서 필요한 값만 추출하여 변수에 할당
배열의 디스트럭처링
▫️배열 디스트럭처링 할당의 대상은 이터러블 이여야 하며, 순서대로 할당된다.
▫️순서대로 할당 되므로 변수의 개수와 이터러블의 요소 개수가 반드시 일치 할 필요는 없다.
▫️할당을 위한 변수에 기본값 설정 가능
/*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 에서 배열 디스트럭처링*/
const array = [1,2,3]
const [x,y]= array // 1,2 개수 일치 하지 않아도 됨
const [x=10, y] =array // 10,2
const [x,...y] = array //1,[2,3]객체의 디스트럭처링
▫️배열과 다르게 순서대로 할당이 아니라 선언된 변수 이름과 프로퍼티 키가 일치시 할당
const data = {
test1 : "테스트1",
test2 : "테스트2",
test3 : "테스트3"
}
const {test1 } = data //테스트1
const {test1: testData, test5 = } = data // 이름바꿈
const {test1, ...rest} = data // 테스트1, {test2: "테스트2", test3: "테스트3"}