1장 타입스크립트 알아보기

아이템 1 타입스크립트와 자바스크립트의 관계 이해하기

• 타입스크립트는 자바스크립트의 상위집합입니다. 다시 말해서, 모든 자바스크립트 프로그램은 이미 타입스크립트 프로그램입니다. 반대로, 타입스크립트는 별도의 문법을 가지고 있기 때문에 일반적으로 유효한 자바스크립트 프로그램이 아닙니다.
• 타입스크립트는 자바스크립트 런타임 동작을 모델링하는 타입 시스템을 가지고 있기 때문에 런타임 오류를 발생시키는 코드를 찾아내려고 합니다. 그러나 모든 오류를 찾아내리라 기대하면 안 됩니다. 타입 체커를 통과하면서도 런타임 오류를 발생시키는 코드는 충분히 존재할 수 있습니다.
• 타입스크립트 타입 시스템은 전반적으로 자바스크립트 동작을 모델링합니다. 그러나 잘못된 매개변수 개수로 함수를 호출하는 경우처럼, 자바스크립트에서는 허용되지만 타입스크립트에서는 문제가 되는 경우도 있습니다. 이러한 문법의 엄격함은 온전히 취향 차이이며 우열을 가릴 수 없는 문제입니다.

아이템2 타입스크립트 설정 이해하기

• 타입스크립트 컴파일러는 언어의 핵심 요소에 영향을 미치는 몇가지 설정을 포함하고 있습니다.
• 타입스크립트 설정은 커맨드 라인을 이용하기보다는 tsconfig.json을 사용하는 것이 좋습니다.
• 자바스크립트 프로젝트를 타입스크립트로 전환하는게 아니라면 noImplicitAny를 설정하는 것이 좋습니다.
• “undefined는 객체가 아닙니다” 같은 런타임 오류를 방지하기 위해 strictNullChecks를 설정하는 것이 좋습니다.
• 타입스크립트에서 엄격한 체크를 하고 싶다면 strict 설정을 고려해야 합니다.

아이템3 코드 생성과 타입이 관계없음을 이해하기

• 코드 생성은 타입 시스템과 무관합니다. 타입스크립트 타입은 런타임 동작이나 성능에 영향을 주지 않습니다.
• 타입 오류가 존재하더라도 코드 생성(컴파일)은 가능합니다.
• 타입스크립트 타입은 런타임에 사용할 수 없습니다. 런타임에 타입을 지정하려면, 타입 정보 유지를 위한 별도의 방법이 필요합니다. 일반적으로는 태그된 유니온 속성 체크 방법을 사용합니다. 또는 클래스 같이 타입스크립트 타입과 런타임 값, 둘 다 제공하는 방법이 있습니다.

아이템 4 구조적 타이핑에 익숙해지기

• 자바스크립트가 덕 타이핑(duck typing) 기반이고 타입스크립트가 이를 모델링하기 위해 구조적 타이핑을 사용함을 이해해야 합니다. 어떤 인터페이스에 할당 가능한 값이라면 타입 선언에 명시적으로 나열된 속성들을 가지고 있을 겁니다. 타입은 봉인되어 있지 않습니다.

interface Vector2D {
  x: number;
  y: number;
}

function calculateLength(v: Vector2D) {
  return Math.sqrt(v.x * v.x + v.y * v.y);
}

interface NamedVector {
  name: string;
  x: number;
  y: number;
}

const v: NamedVector = { x: 3, y: 4, name: 'Zee' };
calculateLength(v);

// 타입스크립트 타입 시스템은 자바스크립트의 런타임 동작을 모델링
// NamedVector의 구조가 Vector2D와 호환되기 때문에 calculateLength 호출이 가능

interface Venctor3D {
  x: number;
  y: number;
  z: number;
}

function normalize(v: Vector3D) {
  const length = calculateLength(v);
  return {
    x: v.x / length,
    y: v.y / length,
    z: v.z / length,
  };
}

normalize({ x: 3, y: 4, z: 5 });
// { x: 0.6, y: 0.8, z:1 };

// Vector3D와 호환되는 {x, y, z} 객체로 calculateLength를 호출하면, 구조적 타이핑 관점에서
// x와 y가 있어서 Vector2D와 호환됩니다. 따라서 오류가 발생하지 발생하지 않았습니다.
// 함수를 작성할 때, 호출에 사용되는 매개변수의 속성들이 매개변수 타입에 선언된 속성만을 가질거라 생각하기 쉬움
// 이러한 타입은 봉인된(sealed) 또는 정확한(precise) 타입이라 불리우는데 타입스크립트는 아님
// 좋든 싫든 열려(open) 있음

• 클래스 역시 구조적 타이핑 규칙을 따른다는 것을 명심해야 합니다. 클래스의 인스턴스가 예상과 다를 수 있습니다.
• 구조적 타이핑을 사용하면 유닛 테스팅을 손쉽게 할 수 있습니다.

아이템 5 any 타입 지양하기

1. any 타입에는 타입 안정성이 없습니다.

2. any는 함수 시그니처를 무시해 버립니다.

3. any 타입에는 언어 서비스가 적용되지 않습니다.

4. any타입은 코드 리팩터링 때 버그를 감춥니다.

5. any는 타입 설계를 감춰버립니다.

6. any는 타입시스템의 신뢰도를 떨어뜨립니다.

7. any 타입을 사용하면 타입 체커와 타입스크립트 언어 서비스를 무력화시켜 버립니다. any 타입은 진짜 문제점을 감추며, 개발 경험을 나쁘게 하고, 타입 시스템으 신뢰도를 떨어뜨립니다. 최대한 사용을 피하도록 합시다.

출처 이펙티브 타입스크립트