#40 함수 안으로 타입 단언문 감추기

이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리

📍요약

✅타입 단언문은 일반적으로 타입을 위험하게 만들지만, 상황에 따라 필요할 때도 있다.

불가피하게 사용해야 한다면, 정확한 정의를 갖는 함수 안으로 숨겨야 한다

 

📍함수를 만들 때, 타입 정보를 힘들게 구성하지 않아도 된다

함수의 타입 정의만 보면, 간단해 보이지만, 내부 로직에 모두 안전한 타입을 붙이는 것은 힘든 작업이다

- 불필요한 예외 상황을 전부 걸러낼 필요는 없다. 타입 정의에서는 any를 쓰면 안되지만..

// 타입 정의
type cacheLast<T extends Function> = (fn: T) =>  T

 

실제 구현체에서는 any 또는 타입 단언문을 사용해도 된다!

- 타입 정의에는 any가 없기 때문에, cacheLast를 호출하는 쪽에서는 any가 쓰였는지 모른다

- 마지막 호출된 함수를 캐싱하는 예시

// 구현체
declare function shallowEqual(a: any, b: any): boolean;

function cacheLast<T extends Function>(fn: T): T {
  let lastArgs: any[] | null = null;
  let lastResult: any;
  // 리턴 부분에 단언문을 쓰지 않으면 에러 발생(any를 T에 할당할 수 없어서 타입 에러)
  return function(...args: any[]) {
	
    if (!lastArgs || !shallowEqual(lastArgs, args)) {
      lastResult = fn(...args);
      lastArgs = args;
    }
    return lastResult;
  } as unknown as T; // 이 부분이 없으면 에러
   // 단순히 as unknown 이라고만 하면 unknown 을 T에 할당할 수 없다고 나옴
}

 

📍두 객체가 동일한지 비교하는 함수 (deep compare)

- a 객체의 키, 밸류 값을 Object.entries() 메서드로 뽑아서 b와 비교

declare function shallowEqual(a: any, b: any): boolean;
function shallowObjectEqual<T extends object>(a: T, b: T): boolean {
  for (const [k, aVal] of Object.entries(a)) {
  	// b 객체에 k 키가 있으면 오른쪽 평가로 넘어가지만, 타입 에러 발생
    // b에 k가 있는 것이 확실한 상황이라 단언문으로 해결 필요
    if (!(k in b) || aVal !== b[k]) { // aVal !== (b as any)[k] 이렇게 해결
                           // ~~~~ Element implicitly has an 'any' type
                           //      because type '{}' has no index signature
      return false;
    }
  }
  return Object.keys(a).length === Object.keys(b).length;
}

 

단언문으로 해결

declare function shallowEqual(a: any, b: any): boolean;
function shallowObjectEqual<T extends object>(a: T, b: T): boolean {
  for (const [k, aVal] of Object.entries(a)) {
    if (!(k in b) || aVal !== (b as any)[k]) { // 단언문
      return false;
    }
  }
  return Object.keys(a).length === Object.keys(b).length;
}