구조 분해 할당

---

배열, 객체 을 해체해 변수에 값을 담는 표현식 입니다. 

---

객체나 배열에 저장된 데이터 전체가 아닌 일부 만 필요한 경우 사용합니다.

 

1. 배열 ( array ) 구조 분해 할당

할당받을 변수를 왼쪽에, 분해할 대상을 오른쪽에 대입해 작성합니다.

ex)

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


const array = [1, 2, 3];
const [first] = array;
console.log(first); // 1

대응되지 않은 인수 는 Rest 파라미터 로 묶어 배열로 데이터를 저장할 수 있습니다.

//Rest 파라미터 사용 
let array = [1, 2, 3, 4, 5];
let [a, b, ...rest] = array;
console.log(rest); // [3, 4, 5];

---

2. 객체 ( object ) 구조 분해 할당

객체 내부 인자 값을 분해해서 변수에 저장합니다.

ex)

const obj = {
  name: "John",
  age: 18,
  memo: "Hello",
};
const { name, age, memo } = obj;
console.log(name); // "John"
console.log(age); // 18
console.log(memo); // "Hello"

// 만약 구조 분해 할당을 사용하지 않는다면?
// 아래와 같이 직접 대입해 주어야 한다.
const name = obj.name;
const age = obj.age;
const memo = obj.memo;

인자를 기준 으로 하기 때문에 순서가 바뀌어도 해당 인자 값을 가져올 수 있습니다.
대응되지 않은 인수 는 Rest 파라미터 로 묶어 객체로 데이터를 저장할 수 있습니다.

ex)

const obj = {
  name: "John",
  age: 18,
  memo: "Hello",
};
const { name, ...rest } = obj;
console.log(name); // "John"
console.log(rest); // { age : 18, memo: 'Hello' }