본문 바로가기
JAVASCRIPT

[JavaScript 구조 분해 할당(Destructuring)]

by dancingcarrot 2023. 4. 26.

1. 구조 분해 할당이란?

구조 분해 할당은 객체나 배열에서 값을 추출하여 변수에 할당하는 것을 말한다.

이를 통해 간단하게 객체나 배열에서 필요한 값만 추출할 수 있다.

 

어떤 객체의 속성과 그 속성을 변수에 담는 변수명이 같을 때 사용할 수 있다.

2.  구조 분해 할당 예시

// 배열에서 구조 분해 할당 예시
const arr = [1, 2, 3, 4, 5];
const one = arr[0];
const two = arr[1];
const three = arr[2];
const four = arr[3];
const five = arr[4];

//구조 분해 할당 했을 때
const [one, two, three, four, five] = arr;
// DOM API에서 구조 분해 할당을 사용하지 않은 예시
const $body = document.body;
const $table = document.createElement('table');
const $result = document.createElement('div');


// DOM API에서 구조 분해 할당 예시
const { body, createElement } = document;
const $table = createElement('table');
const $result = createElement('div');

댓글