> For the complete documentation index, see [llms.txt](https://docs.sysout.co.kr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.sysout.co.kr/web/develop-page/js/syntax/destructuring-assignment.md).

# 구조 분해 할당

## 구조 분해 할당

**구조 분해 할당(destructuring assgiment)**는 ES6에서 새롭게 추가된 문법이다. **비 구조화 할당**이라고도 부른다.

{% embed url="<https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment>" %}

## 배열 구조 분해

```javascript
const arr = [10, 20, 30];
const [a, b, c] = arr;

console.log(a);//10
console.log(b);//20
console.log(c);//30
```

<div align="left"><figure><img src="/files/PtVHdvpsdwEeYSiA2h2B" alt=""><figcaption></figcaption></figure></div>

## 객체 구조 분해

```javascript
const monster = {
    no : 25,
    name : "피카츄",
    type : "전기"
};

const {no, name} = monster;
console.log(no);//25
console.log(name);//피카츄
```

<div align="left"><figure><img src="/files/7qEzxfpAYfMUAB92yioe" alt=""><figcaption></figcaption></figure></div>