비구조화할당.md

💡 배열이나 객체 속성을 해체하여 개별 변수에 값을 담을 수 있는 JavaScript 표현식

기본 구조

let [x, y] = [1, 2]
console.log(x)
console.log(y)

좌측에는 변수, 우측에는 해당 변수에 넣어지는 값 표현 🙂 배열 - [ ], 객체 - { }

장점 👏🏻

• 배열, 객체 내 값을 추출하는 코드 간단
• 필요한 객체와 나머지 요소 분리 간단
• 기본 값 지정 가능

비구조화할당 전 코드 🫥

let fruit = ['Apple', 'Banana']

let Apple = fruit[0]
let Banana = fruit[1]

console.log(Apple)
console.log(Banana)

비구조화할당 코드 😉

let fruits = ['Apple', 'Banana']

let [Apple,Banana] = fruits

console.log(Apple)
console.log(Banana)

비구조화할당 구조 분해 🎨

let fruit = ['apple', 'banana', 'peach', 'pear']

let [apple, ...etc] = fruit

console.log(apple)
console.log(etc)

• 결과

  ‘apple’

  [’banana’, ‘peach’, ‘pear’]

… 👉🏻 하나의 변수를 할당하고 나머지 값들을 모두 넣어줌 …인 전개 연산자를 사용하려면 가장 마지막 요소에 넣어주어야 함 ⭐

기본값 지정

let fruit = ['apple', 'banana', 'peach']
let [apple, banana, peach, pear = 'pear'] = fruit

console.log(apple)
console.log(banana)
console.log(peach)
console.log(pear)

• 결과

  ‘apple’

  ‘banana’

  ‘peach’

  ‘pear’