Destructuring

• 한글로 풀어 쓰면 '구조 분해 할당' 또는 '비구조화 할당'으로 표현

const myObject = {
  name: '스티븐',
  age: 30,
  gender: 'male'
}

• 위의 객체에서 name, age, gender를 각각 분리해서 사용하고자 할 때 destructuring을 사용

JavaScript에서의 Destructuring

const { name, age, gender } = myObject;

TypeScript에서의 Destructuring

잘못 된 방법

const { name: string, age: number, gender: string } = myObject;

• name, age, gender를 각각 string, number, string으로 명명하는식으로 작성했음

쉬운 방법

const {name, age, gender}: { name: string, age: number, gender: string } = myObject;

• {}로 감싸진 전체에 대해서 타입을 지정해야 됨

권장하는 방법

interface User {
  name: string,
  age: number,
  gender: string
}

const {name, age, gender}: User = myObject;

• interface로 미리 타입을 정의하고 해당 interface를 타입으로 지정하는 방식