Tip-01. 타입 추론

readonly, as const

• readonly
  • 해당 변수를 상수로 바꿔줌
  • type, interface, class의 속성에 부여 가능
• as const
  • 해당 값을 최대한 좁은 타입으로 추론해줌
  • 객체에 사용할 경우 바로 아래 depth까지 readonly로 바꿔줌
  • 변수에 사용할 경우 해당 변수를 상수로 간주함

const v1 = {
  x: 1,
  y: 2,
}; // { x: number, y: number }

const v2 = {
  x: 1 as const,
  y: 2,
}; // { x: 1, y: number}

const v3 = {
  x: 1,
  y: 2,
} as const; // { readonly x: 1; readonly y: 2; }

사용자 타입 가드

유니온 타입을 사용할 때 함수 내부에서 타입 분기를 하고 싶을 때 사용하면 유용할 듯.
당장 내일 회사가서 써먹어야 한다... 급하다.

• is : 함수 리턴값이 true면 타입을 좁혀줌. 함수를 조건문의 boolean으로 사용할 떄 쓰기 좋음
• in : 해당 프로퍼티가 있는지 확인함. 마찬가지로 타입가드 역할을 함

interface Foo {
  foo: number;
  common: string;
}

interface Bar {
  bar: number;
  common: string;
}
// 리턴값이 true면 arg는 Foo로 취급하겠다는 함수임
// 'arg is Foo' 타입이 없으면 제대로 동작 안함
function isFoo(arg: any): arg is Foo {
  return arg.foo !== undefined;
}

function doStuff(arg: Foo | Bar) {
  if (isFoo(arg)) {
    console.log(arg.foo); // ㅇㅋ
    console.log(arg.bar); // Error!
  } else {
    console.log(arg.foo); // Error!
    console.log(arg.bar); // ㅇㅋ
  }

  if ('foo' in arg) {
    console.log(arg.foo); // ㅇㅋ
    console.log(arg.bar); // 에러남
  } else {
    console.log(arg.foo); // 에러남
    console.log(arg.bar); // ㅇㅋ
  }
}

문맥과 값을 분리할 떄 주의점

매개변수에 문자열을 넣는 것과 변수를 넣는 것은 다르게 동작한다.

function toString(str: 'javascript' | 'typescript' | 'python') {
  console.log(str);
}

// 통과
toString('javascript');

// 통과 못함
let str = 'javascript'; // const로 바꾸던가 as const를 뒤에 붙이던가 해야함
toString(str);