이펙티브 타입스크립트 38 ~ 44

item 38. any type은 가능한 좁은 범위에서 사용하기

• any type 좁게 사용하기

• any로 선언에서 직접 파라미터에 넣거나 반환하지 말 것.

• as any를 사용하자!! => 전체 문맥에 영향을 주지 않는다.(any 사용범위를 최소한으로 좁히기)

• 강제로 타입오류를 제거할 때 @ts-ignore 사용가능 but 문제가 되는 코드를 찾아 제거해야 한다.

function eatDinner1() {
  const pizza: any = getPizza();  // Don't do this
  eatSalad(pizza);  // ok
  pizza.slice();  // This call is unchecked!
}

function eatDinner2() {
  const pizza = getPizza();
  eatSalad(pizza as any);  // This is preferable
  pizza.slice();  // this is safe
}

item 39. any를 구체적으로 변형해 사용하기

• any[] or { [key:string] : any } or Record<string, any> or object.. , () => any , (...args:any[]) => any 처럼 값을 최대한 좁혀서 사용하기

• 근데 여기서 object는 객체지만 속성에 접근 할 수 없음.

function getLengthBad(array: any) {  // Don't do this!
  return array.length;
}

function getLength(array: any[]) {  // This is better
  return array.length;
}

function hasAKeyThatEndsWithZ(o: Record<string, any>) {
  for (const key in o) {
    if (key.endsWith('z')) {
      console.log(key, o[key]);
      return true;
    }
  }
  return false;
}

function hasAKeyThatEndsWithZ(o: object) {
  for (const key in o) {
    if (key.endsWith('z')) {
      console.log(key, o[key]);
      //               ~~~~~~ Element implicitly has an 'any' type
      //                      because type '{}' has no index signature
      return true;
    }
  }
  return false;
}

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

• 타입단언문은 일반적으로 타입을 위험하게 만들지만, 상황에 따라 필요하기도 하고 현실적인 해결책이 되기도 한다.

• 불가피하게 사용해야 한다면, 정확한 정의를 가지는 함수 안으로 숨기도록 한다.

export async function fetchPeak(peakId: string): Promise<MountainPeak> {
  const maybePeak = checkedFetchJSON(`/api/mountain-peaks/${peakId}`);
  if (
    !maybePeak ||
    typeof maybePeak !== 'object' ||
    !('firstAscentYear' in maybePeak)
  ) {
    throw new Error(`Invalid mountain peak: ${JSON.stringify(maybePeak)}`);
  }
  return checkedFetchJSON(
    `/api/mountain-peaks/${peakId}`,
  ) as Promise<MountainPeak>;
}

item 42. 모르는 타입의 값에는 any 대신 unknown을 사용하기

• unknown은 any 대신 사용 할 수 있는 안전한 타입입니다. 어떤 값이 있지만 type을 알지 못하는 경우 unknown을 사용하면 됩니다.

• 사용자가 타입 단언문이나 타입 체크를 사용하도록 강제하려면 unknown을 사용한다.

• {} => null undefined를 제외한 모든 값을 포함합니다.

• object는 모든 비 기본형 (non -primitive) 타입으로 이뤄짐.

• unknown type이면 => 사용자 정의 가드로 타입변경가능.

// return is any
function parseYAML(yaml: string): any {
  // ...
}

const book = parseYAML(`
  name: Jane Eyre
  author: Charlotte Brontë
`);
console.log(book.title);  // No error, logs "undefined" at runtime
book('read');  // No error, throws "book is not a function" at runtime

// return is unknown

function safeParseYAML(yaml: string): unknown {
  return parseYAML(yaml);
}
const book = safeParseYAML(`
  name: The Tenant of Wildfell Hall
  author: Anne Brontë
`);
console.log(book.title);
//          ~~~~ 'book' is of type 'unknown'
book("read");
// Error: 'book' is of type 'unknown'

function isBook(value: unknown): value is Book {
  return (
      typeof(value) === 'object' && value !== null &&
      'name' in value && 'author' in value
  );
}
function processValue(value: unknown) {
  if (isBook(value)) {
    value;
    // ^? (parameter) value: Book
  }
}