러닝 자바스크립트: ES6로 제대로 입문하는 모던 자바스크립트 웹 개발

161

5

장

표현식과 연산자

x

<< =

y x

=

x

<<

y

x

>> =

y x

=

x

>>

y

x

>>> =

y x

=

x

>>>

y

x

&=

y x

=

x

&

y

x

|

=

y x

=

x

|

y

x

^

=

y x

=

x

^

y

5.10

해체 할당

ES6

에서 새로 도입한

해체 할당

destructuring

assignment

은 매우 환영 받는 기능입니다. 이 기능은 객

체나 배열을 변수로 ‘해체’할 수 있습니다. 객체 해체부터 시작합시다.

// 객체 선언

const

obj

= {

b

:

2

,

c

:

3

,

d

:

4

};

// 해체 할당

const

{

a

,

b

,

c

} =

obj

;

a

; //

undefined

:

obj

에는 "

a

" 프로퍼티가 없습니다.

b

; //

2

c

; //

3

d

; //

ReferenceError

: "

d

"는 정의되지 않았습니다.

객체를 해체할 때는 반드시 변수 이름과 객체의 프로퍼티 이름이 일치해야 합니다. 프로퍼티

이름이 유효한 식별자인 프로퍼티만 해체 후 할당됩니다. 이 예제에서는

obj

에

a

프로퍼티가

없으므로

a

는

undefined

를 할당받습니다. 해체 할당에

d

라는 프로퍼티가 없으므로

d

는 선언조

차 되지 않았습니다.

이 예제에서는 선언과 할당을 같은 문에서 실행했습니다. 객체 해체는 할당만으로 이뤄질 수도

있지만, 그렇게 하려면 반드시 괄호를 써야 합니다. ...