📘 이펙티브 타입스크립트 – Item 1~2 정리

✅ Item 1: TypeScript와 JavaScript의 관계 파악하기

🔍 핵심 요약

TypeScript는 JavaScript의 상위 집합(Superset) 이다. 즉, 모든 JavaScript 코드는 유효한 TypeScript 코드.

• 타입 검사는 컴파일 단계에서만 이뤄지고, 실행은 JS로 변환된 결과물이 담당.
• TypeScript는 정적 타입 검사 도구이지, 런타임 타입 검사가 아님.

✅ 핵심 포인트

1. TS는 런타임에서 타입 체크를 하지 않는다
2. TS 타입 오류가 있어도 JS는 생성된다 (--noEmitOnError 제외)
3. JS 문법이 TypeScript에 그대로 존재한다

💻 예시 코드

// example.ts
function double(x: number): number {
  return x * 2;
}

const result = double('hello'); // ❌ TS 오류
console.log(result); // 런타임에서는 NaN 출력

$ tsc example.ts        # 컴파일 경고 발생
$ node example.js       # NaN 출력됨

🛠 설정 팁

tsconfig.json에서 아래 옵션을 설정하면 타입 오류 시 JS 생성을 방지할 수 있다.

{
  "compilerOptions": {
    "noEmitOnError": true
  }
}

📦 요약

✅ Item 2: 사용 중인 tsconfig 옵션 이해하기

• https://www.typescriptlang.org/tsconfig/

🔍 핵심 요약

TypeScript의 동작은 tsconfig.json 설정에 따라 크게 달라짐. strict 모드를 포함한 다양한 옵션이 타입 안전성과 직결되므로 이해가 필요함.

💡 주요 옵션

🧾 예시 tsconfig.json

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "CommonJS",
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "esModuleInterop": true,
    "outDir": "./dist"
  },
  "include": ["src"]
}

💥 예시 코드

function divide(a: number, b: number) {
  return a / b;
}
console.log(divide(10)); // 인자 하나 빠짐

• strict: true가 없으면 통과
• strict + noImplicitAny가 있으면 컴파일 에러 발생

🛠 tsc 명령어 정리

🔹 전체 프로젝트 컴파일

npx tsc

🔹 타입 오류 발생 시 JS 파일 생성 방지

npx tsc --noEmitOnError

또는 tsconfig.json에 아래 설정 추가:

{
  "compilerOptions": {
    "noEmitOnError": true
  }
}

🔹 특정 파일만 컴파일

npx tsc src/example.ts

🔹 타입 검사만 수행하고 JS는 생성하지 않기

npx tsc --noEmit

💡 VSCode 외부에서 타입 체크 자동화할 때 유용

📦 요약