구조분해 할당

https://ko.javascript.info/destructuring-assignment

 

구조분해 할당? (destructing assignment)
= 객체나 배열을 변수로 '분해'할 수 있게 해 주는 문법.

const example = { a: 123, b: { c: 135, d: 146 } };
const a = example.a;
const d = example.b.d;

위처럼 속성 이름을 변수로 만들어 주는 경우가 있는데, 

값들을 꺼내기만을 위해서 example을 선언해 주고 있기 때문에 코드가 깔끔하지 않을 수 있움..

이럴 땐 아래처럼 구조분해 할당을 활용할 수 있다.

example에서 필요한 정보가 들어 있는 값들의 자리에 맞게 변수를 선언해 줄 수 있다.

const {
  a,
  b: {d},
} = example;
console.log(a); //123
console.log(d); //146

example이라는 객체에서 같은 위치에 있는 것을 꺼내 온다고 생각하면 된다.

 

배열에서도 마찬가지~

arr = [1, 2, 3, 4, 5];
const x = arr[0];
const y = arr[1];
const z = arr[4];

const [x, y, , , z] = arr;

this는 함수를 호출할 때 어떻게 호출되었느냐에 따라 결정되기 때문에

this가 있는 경우에는 구조분해 할당을 하지 않는 것이 좋다.

 

참조 : 제로초(zerocho)님 인프런 강의