JS

구조 분해 (Destructing)

프도의길 2021. 9. 22. 18:30

구조 분해 할당은 Spread 문법을 이용하여 값을 해체한 후, 개별 값을 변수에 새로 할당하는 과정을 말합니다.

분해 후 새 변수에 할당

배열

const [a, b, ...rest] = [10, 20, 30, 40, 50];

// 질문: a, b, rest는 각각 어떤 값인가요?

객체

const {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}

// 질문: a, b, rest는 각각 어떤 값인가요?

  • 객체에서 구조 분해 할당을 사용하는 경우, 선언(const, let, var)과 함께 사용하지 않으면 에러가 발생할 수 있습니다.
  • 선언없이 할당하는 경우, 이 콘텐츠의 하단있는 공식문서 링크를 통해 내용을 확인할 수 있습니다.

유용한 예제: 함수에서 객체 분해

function whois({displayName: displayName, fullName: {firstName: name}}){

console.log(displayName + " is " + name);

}

let user = {

id: 42, displayName: "jdoe",

fullName: {

firstName: "John",

lastName: "Doe" }

};

 

whois(user) // 질문: 콘솔에서 어떻게 출력될까요?

'JS' 카테고리의 다른 글

메서드와 this  (0) 2021.10.01
객체 복사, 병합과 Object.assign  (0) 2021.10.01
Spread/Rest 문법  (0) 2021.09.22
참조 자료형  (0) 2021.09.22
원시 자료형  (0) 2021.09.22