본문 바로가기

Web/Javascript

[ Javascript ] 알아두면 유용한 문법 - 비구조화 할당(2)

반응형

저번에 비구조화 할당에 대해서 말씀드렸는데요,

오늘은 더 복잡한 객체일 경우 어떻게 사용하는지에 대해서

포스팅을 하겠습니다.

 

다음과 같이 객체를 선언합니다.

 

1
2
3
4
5
6
7
8
9
10
11
const Object = {
  state: {
    information: {
      name: 'imcodding',
      nation: 'korea',
      languages: ['korean''english']
    },
    isLoading: true,
  },
  defaultValue: 5
}

 

위의 객체 형태는 객체 안에 또다른 객체를 가지고 있는 형태입니다.

이런 경우일 때도 객체 안의 변수를 사용하는 것처럼 객체를 꺼내면 됩니다.

 

1
2
3
const { name, nation, languages } = Object.state.information;
const { isLoading }  = Object.state;
const { defaultValue } = Object;

 

이렇게 할 경우, 꺼낸 변수를 객체명을 붙일 필요없이 사용할 수 있는 것입니다.

이를 통해 새로운 객체를 할당해서 사용해도 됩니다.

 

1
2
3
4
5
6
7
8
const newObject = {
  name,
  nation,
  languages,
  isLoading,
  defaultValue
}

 

도움이 돼셨다면 좋아요 꾸욱! 부탁드립니다.

감사합니다.

반응형