JavaScript 구조 분해 할당

구조 분해 할당

배열이나 객체의 속성을 해체하여 그 값을 변수에 담을 수 있게 하는 JavaScript 표현식이다.

 

출처: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

구조 분해 할당 - JavaScript | MDN

 

예시

var candyMachine = {
    status: {
        name: 'node',
        count: 5
    },
    getCandy: function () {
        this.status.count--
        return this.status.count
    }
}

var getCandy = candyMachine.getCandy
var count = candyMachine.status.count


----------------------------------------------


const candyMachine = {
    status: {
        name: 'node',
        count: 5
    },
    getCandy: function () {
        this.status.count--
        return this.status.count
    }
}

const { getCandy, status: { count } } = candyMachine

• candyMachine부터 시작해서 속성을 찾아 들어가야함
• const { 변수 } = 객체 로 객체 안의 속성을 변수명으로 사용이 가능
  • 단, getCandy() 를 실행을 했을 때는 결과가 candyMachine.getCandy와는 달라지므로 주의
• const처럼 속성 안의 속성도 변수명으로 사용 가능

(1) 배열 구조 분해 할당

let array = ['nodejs', {}, 10, true]
let node = array[0]
let obj = array[1]
let bool = array[3]


------------------------------------------


const array = ['nodejs', {}, 10, true]
const [node, obj, , bool] = array

• const [변수] = 배열 형식
  • 각 배열 인덱스와 변수가 대응됨
  • node는 array[0], obj = array[1], bool = array[3]