우리가 사용하게 되는 데이터의 90%는 객체와 배열로 이루어져 있다.
객체와 배열을 사용할 때 데이터에 접근하는 여러 방법이 있는데
그 중 가장 효율적인 방법은 배열과 객체의 구조를 분해하여 새로운 변수에 할당해서 사용하는 방법입니다.

구조분해 할당.

--------------CASE 1--------------------
let a, b, rest;
[a, b] = [1, 2];
console.log(a); // 1
console.log(b); // 2

--------------CASE 2--------------------
[a, b, ...rest] = [1, 2, 3, 4, 5];
console.log(a); // 1
console.log(b); // 2
console.log(rest); // [3, 4, 5]

--------------CASE 3--------------------
({a, b} = {a:1, b:2});
console.log(a); // 1
console.log(b); // 2

구조분해 할당은 좌변에 변수와 우변에는 값이 되는 변수를 넣습니다.

배열의 구조분해

--------------CASE 1--------------------
let foo = ["one", "two", "three"];
let [one, two, three] = foo;
console.log(one); // "one"
console.log(two); // "two"
console.log(three); // "three"

--------------CASE 2--------------------
let a,b = [a, b]
console.log(a) // a
console.log(b) // b

객체의 구조분해

--------------CASE 1--------------------
let o = {p: 42, q: true};
let {p, q} = o;
console.log(p); // 42
console.log(q); // true

--------------CASE 2--------------------
var a, b; ({a, b} = {a:1, b:2});
console.log(a); //1
console.log(b); //2

--------------CASE 3--------------------
let o = {p: 42, q: true};
let {p: foo, q: bar} = o;
console.log(foo); // 42
console.log(bar); // true

--------------CASE 4--------------------
let metadata = {
title: "Scratchpad",
translations: [
{
locale: "de",
localization_tags: [ ],
last_edit: "2014-04-14T08:43:37",
url: "/de/docs/Tools/Scratchpad", title: "JavaScript-Umgebung"
}
],
url: "/en-US/docs/Tools/Scratchpad"
};
var { title: englishTitle, translations: [{ title: localeTitle }] } = metadata;
console.log(englishTitle); // "Scratchpad" console.log(localeTitle); // "JavaScript-Umgebung"

이용하기..

구조분해할당을 이용하여 객체와 배열 내부에 접근하여 재사용 가능하게 할당후 데이터를 뽑아서 쓰는 방법이다. api의 데이터를 분해 할당하여 데이터를 사용하거나, 복합한 객체에서 필요한 데이터를 뽑아 쓸 때 사용할 수 있다.