Destructuring Assignment, 구조분해할당

자바스크립트를 사용하면서 구조분해할당을 사용할 수 있다.

 

구조분해할당은 배열 및 객체의 value값을 분해하여 불러오거나 변경하는데 유용하게 사용할 수 있따.

let [a,b] = [2, 10];
console.log(a); // 2
console.log(b); // 10

let arr = [1,2,3,4,5,6]
let [a,b,c,...rest] = arr
console.log(rest) // [4,5,6]
console.log(a) // 1
console.log(b) // 2

...rest를 사용하면 위와 같이도 활용이 가능하다.

 

또한 배열에서 구조분해할당을 이용하면 아래 처럼 활용이 가능하다.

//변경전

const arr = [1,2,3]
const a = arr[0];
const c = arr[2];
console.log(a,c);

//구조분해할당 활용

const arr = [1,2,3];
const [a,b,c] = arr
console.log(a,c) // 1 3

 

 

구조분해할당은 배열안에 객체에서도 사용할 수 있다.

const obj = { name: "철수", age:20, school: "다람쥐초등학교"}
const {name, age, school} = obj;

console.log(name) // '철수' 
console.log(age) // 20

또한 배열에서처럼 rest를 활용하여 뒤에 오는 key와 value만 뽑을 수 도있다.

const obj = { name: "철수", age:20, school: "다람쥐초등학교"}
const {name, ...rest} = obj;

console.log(name) // '철수'
console.log(rest) // { age: 20, school: '다람쥐초등학교' }