JS 객체: 구조화, 이름 변경 및 기본값을 한 줄에 모두 처리

다음과 같이 정의된 객체 car 및 motorcycle가 있다고 가정합니다.

const car = {
  make: "Tesla",
  weight: 3500
};

const motorcycle = {
  make: "Harley",
  registered_to: "John Smith"
};

구조화

Objectcar 에서 키"Tesla" 아래의 값make을 추출하고 다음과 같이 로컬 변수make에 할당할 수 있습니다.

let { make } = car;
console.log(make); // prints "Tesla"

그러나 후드 아래의 구문 { make }은 실제로 { make: make } 의 줄임말입니다. 우리를 이끄는 것은...

이름 바꾸기

키 "Tesla" 아래의 make 값을 가져오지만 manufacturer 와 같이 다른 변수에 할당하려면 어떻게 합니까?

let { make: manufacturer } = car;
console.log(manufacturer); // prints "Tesla"

기본

motorcycle 객체에 대한 정의에서 weight 키-값 쌍이 정의되지 않은 방법에 주목하십시오. 1000 의 가중치에 기본값 motorcycle를 할당하고 weight 변수로 할당하려고 하면 어떻게 될까요?

let { weight = 1000 } = motorcycle;
console.log(weight); // prints 1000

그러나 weight 가 car 객체와 같이 정의되어 있다면 우리는 단순히 car 에 대해 구조화를 수행하는 것입니다.

let { weight = 1000 } = car;
console.log(weight); // prints 3500

올인원

이제 car 및 motorcycle 의 registered_to 값을 가져와서 변수 owner 에 저장하고 키가 없는 경우 기본값을 "Jane Doe" 로 설정하려고 한다고 가정합니다. 위의 3가지 기술을 모두 한 줄에 결합할 수 있습니다.

let { registered_to: owner = "Jane Doe" } = car;
console.log(owner); // prints "John Doe"

let { registered_to: owner = "Jane Doe" } = motorcycle;
console.log(owner); // prints "John Smith"

이게 도움이 되길 바란다. 저는 이러한 한 줄짜리 접근 방식이 우리가 통사론적 설탕이라고 부르는 것이라고 믿습니다. 해당되는 경우 깨끗하고 읽기 쉬운 코드를 연습하십시오.