[이펙티브 타입스크립트] 아이템30 ~ 아이템31

[아이템30] 문서에 타입 정보를 쓰지 않기

// rgb 문자열을 반환한다.
// 0개 또는 1개의 매개변수를 받는다.
// 매개변수가 없을 때는 표준 rgb을 반환한다.
// 매개변수가 있을 때는 특정 페이지의 rgb을 반환한다.
function getRGB(page?: string) {
  return page === "login" ? { r: 127, g: 127, b: 127 } : { r: 0, g: 0, b: 0 };
}

주석의 3가지 문제점

• 함수가 string을 반환한다고 나와있지만 실제로는 {r, g, b} 객체를 반환한다.
• 매개변수를 0개 또는 1개 받는다고 나와있지만 타입 시그니처만 봐도 명확하게 알 수 있는 정보다.
• 불필요하게 장황하다.

올바른 주석

// 애플리케이션 또는 특정 페이지의 RGB를 가져옵니다
function getRGB(page?: string) {
  return page === "login" ? { r: 127, g: 127, b: 127 } : { r: 0, g: 0, b: 0 };
}

👉 주석과 변수명에 타입 정보를 적는 것은 피하자

[아이템31] 타입 주변에 null값 배치하기

function extent(nums: number[]) {
  let min, max;
  for (const num of nums) {
    if (!min) {
      min = num;
      max = num;
    } else {
      min = Math.min(min, num);
      max = Math.max(max, num);
    }
  }
  return [min, max];
}
const [min, max] = extent([0, 1, 2]); // ❌ [0,2] 가 아닌 [1,2] 반환

❗ 문제점

• 최솟값이나 최댓값이 0인 경우, 값이 덧씌어짐.
• nums 배열이 비어있으면 [undefined, undefined]를 반환

✔️ 개선 방법

function extent(nums: number[]) {
  let result: [number, number] | null = null;
  for (const num of nums) {
    if (!result) {
      result = [num, num];
    } else {
      result = [Math.min(num, result[0]), Math.max(num, result[1])];
    }
  }
  return result;
}
const [min, max] = extent([0, 1, 2])!; // 정상 -> null 단언 사용
const range = extent([0, 1, 2]);
if (range) {
  const [min, max] = range; // 정상 -> if문 사용
}

한 값의 null 여부가 다른 값의 null 여부에 암시적으로 관련되도록 설계하면 안된다. API 작성 시에는 반환 타입을 큰 객체로 만들고 반환 타입 전체가 null이거나 null이 아니게 만들어야 한다.