Destructuring

---

Destructuring

한국어로는 구조 분할 할당이라고 불리며, 배열의 원소나 객체의 property를 추천해서 변수에 저장할 수 있도록 해준다.

얼핏 보면 이전 시간에 배운 spread operator와 비슷하다고 생각할 수 있겠지만 이 둘은 전혀 다른 것이다.

Spread & Rest Operators

spread operator는 모든 element와 property를 가져와서 새로운 배열이나 객체에 전달하는 것이라면, Destructuring같은 경우는 하나만 가져와서 변수에 저장하는 것이다.

JavaScript를 사용하다보면 매우 자주 사용되는 방식이니 꼭 알고 있자.

---

Array Destructuring

const [a, b] = ['Hello', 'Max']
console.log(a) // Hello
console.log(b) // Max

---

Object Destructuring

const {name} = {name:'Max', arg:28}
console.log(name) // Max
console.log(age) // undefined

객체 Destructuring할 때에는 객체의 속성을 꼭 변수 이름으로 쓸 필요가 없다.

객체마다 속성 이름은 독립적이기 때문에 중복인 이름이 있을 수도 있기 때문이다. 

객체의 속성 이름 이외의 다른 값으로 사용하는 방법은 다음과 같다.

cosnt { name: nickName } = {name:'Max', arg:28}
console.log(nickName) // Max
console.log(age) // undefined