비구조화할당(Destructuring assignment)

비구조화할당이란?

구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 자바스크립트 표현식

배열

const [rock, scissor, paper] = ["Rock", "Scissor", "Paper"];
console.log(rock); // Rock
console.log(scissor); // Scissor
console.log(paper); // Paper

좌항이 호출될 변수명이고 우항이 각각의 호출값이다

const game = ["Rock", "Scissor", "Paper"];
const [rock, ...rest] = game
console.log(rock) // Rock
console.log(rest) // ["Scissor","Paper"]

rest parameter를 이용해 요소를 분리할 수 있다

객체

var { a1, a2, ...rest } = { a1 : 10, a2 : 20, a3 : 30, a4 : 40 };
console.log(a1); // 10
console.log(a2); // 20
console.log(rest); // { a3: 30, a4: 40 }

객체의 경우 우항의 key값이 좌항의 변수명으로 적용된다

복사

var arr = [1,2,3];
var copy1 = arr;
var [...copy2] = arr;
var copy3 = [...arr];

arr[0] = 0;
console.log(arr); // [ 0, 2, 3 ]
console.log(copy1); // [ 0, 2, 3 ]
console.log(copy2); // [ 1, 2, 3 ]
console.log(copy3); // [ 1, 2, 3 ]

rest parameter를 이용해 깊은 복사가 가능하다.copy1은 앝은 복사가 되었지만 copy2와 copy3은 깊은 복사가 되었다.