Effective Typescript - 아이템23

Item 23 - 한꺼번에 객체 생성하기

객체를 생성할 때는 속성을 하나씩 추가하기보다는 여러 속성을 포함해서 한꺼번에 생성해야 타입 추론에 유리합니다.

 

interface Point {
  x: number
  y: number
}
const pt: Point = {}
// ~~ {} 형식에 x,y 속성이 없습니다.
pt.x = 3
pt.y = 4

interface Point {
  x: number;
  y: number;
}
const pt: Point = {
  x: 3,
  y: 4,
};
pt.x = 4; 
//정상 
console.log(pt.x); // 4

 

작은 객체들을 조합해서 큰 객체를 만들어야 하는경우 '객체 전개 연산자' ... 를 사용하여 만들자.

interface Point {
  x: number
  y: number
}
const pt = { x: 3, y: 4 }
const id = { name: 'Pythagoras' }
const namedPoint = { ...pt, ...id }
namedPoint.name // OK

조건부 속성 추가하기 

declare let hasMiddle: boolean
const firstLast = { first: 'Harry', last: 'Truman' }
const president = { ...firstLast, ...(hasMiddle ? { middle: 'S' } : {}) }

전개 연산자로 한꺼번에 여러속성 추가하기

declare let hasDate: boolean
const nameTitle = { name: 'Khufu', title: 'Paraoh' }
const pharaoh = {
  ...nameTitle,
  ...(hasDate ? { start: -2589, end: -2566 } : {}),
}

pharaoh.start