DIL: 이펙티브 타입스크립트

스터디: 월간 CS, https://github.com/monthly-cs/2024-05-effective-typescript
작성일: 2024-06-05
작성자: dusunax

---

아이템 41: any의 진화를 이해하기 Understand Evolving Types

• 일반적인 타입: 변수의 타입은 변수를 선언할 때 결정 > 이후 정체
• any: 이브이

function range(start: number, limit: number) {
  const nums = [];
  //    ^? const nums: any[]
  for (let i = start; i < limit; i++) {
    nums.push(i);
    // ^? const nums: any[]
  }
  return nums;
  //     ^? const nums: number[]
  // number 값을 넣는 순간 진화한다
}

• 타입 좁히기 type narrowing 와 다른 점 => 배열에 다양한 타입의 요소를 넣으면 타입이 확장되며 진화한다

const result = [];
//    ^? const result: any[]
result.push("a");
result;
// ^? const result: string[]
result.push(1);
result;
// ^? const result: (string | number)[]

• 초기값이 null인 경우도 any 진화. try/catch 블록 안에서 변수를 할당하는 경우에 보통 나타남

let value = null;
//  ^? let value: any
try {
  value = doSomethingRiskyAndReturnANumber();
  value;
  // ^? let value: number
} catch (e) {
  console.warn("alas!");
}
value;
// ^? let value: number | null
// 진화

• if else문의 경우

let value;
//  ^? let value: any
if (Math.random() < 0.5) {
  value = /hello/;
  value;
  // ^? let value: RegExp
} else {
  value = 12;
  value;
  // ^? let value: number
}
value;
// ^? let value: number | RegExp
// 진화함

특징

• any 타입 진화는 가 암시적 any에서 적용되며, 명시적 any는 유지된다.
• 값을 할당하거나, 배열에 요소를 넣은 후에만 일어나기 때문에 => 편집기에서 이상하게 보일 수 있다. (할당이 일어난 줄의 타입을 조사해도 any. 할당이 끝난 후, 진화)
• 어떠한 할당도 하지 않고 사용하면 noImplicitAny 오류
  • 암시적 any 상태일 때 값을 읽으려 하면 오류가 발생한다.

함수 호출을 거쳐도 진화하지 않는다

• 아래 예시에서 .forEach 함수 호출을 거쳤을 때 진화하지 않음
• forEach로 순화하는 대신, 배열의 map과 filter 메서드로 단일 구문으로 배열 생성 => any 전체를 진화시키는 방법 생각

function makeSquares(start: number, limit: number) {
  const nums = [];
  //    ~~~~ Variable 'nums' implicitly has type 'any[]' in some locations
  range(start, limit).forEach((i) => {
    nums.push(i * i); // 진화하지 않는다
  });
  return nums;
  //     ~~~~ Variable 'nums' implicitly has an 'any[]' type
}

진화 방식?

• 일반적인 변수가 추론되는 원리와 동일하다.
• 진화한 배열의 타입이 (string|number)[]일 때, number[]이어야 하는 데 string이 섞였여서 진화했을 가능성도 있다.
• 따라서 명시적 타입 구문이 더 안전성 있는 좋은 설계

Things to Remember

• While TypeScript types typically only refine, the types of values initialized to null, undefined, or [] are allowed to evolve.
  • 일반적으로 타입은 정제만 되지만, 암시적 Any인 경우 (null, undefined, []로 초기화된 경우) 진화한다
• Recognize and understand this construct where it occurs, and use it to reduce the need for type annotations in your own code.
  • 이런 동작이 일어남을 알고 있으면, 필요한 경우 타입 구문을 줄일 수 있다.
• For better error checking, consider providing an explicit type annotation instead of using evolving types.
  • 에러 체킹과 안정성을 위해서는, 타입을 진화 시키는 것보다 명시적인 타입 구문을 사용하는 것이 낫다.