# 내가 TypeScript를 팔아먹는 방법(Sales Pitch)

> Clean Markdown view of GeekNews topic #19944. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=19944](https://news.hada.io/topic?id=19944)
- GeekNews Markdown: [https://news.hada.io/topic/19944.md](https://news.hada.io/topic/19944.md)
- Type: GN+
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2025-03-25T09:48:23+09:00
- Updated: 2025-03-25T09:48:23+09:00
- Original source: [2ality.com](https://2ality.com/2025/03/typescript-sales-pitch.html)
- Points: 4
- Comments: 4

## Summary

TypeScript는 JavaScript에 타입 정보를 추가하여 코드 작성 시 자동 완성과 오류 감지를 제공하며, 함수 매개변수 및 반환 타입을 명시함으로써 코드의 이해도와 유지 보수성을 향상시킵니다. 또한, TypeScript는 코드 리팩토링을 안전하게 수행할 수 있도록 도와주며, Node.js, Deno, Bun 같은 플랫폼에서 직접 실행이 가능하고, Vite 같은 번들러에서 기본 지원됩니다. 그러나 학습 곡선이 존재하고 일부 npm 패키지에서 타입 정의가 없거나 잘못된 경우 문제가 발생할 수 있으며, `tsconfig.json` 설정이 복잡할 수 있습니다.

## Topic Body

- TypeScript는 JavaScript에 타입 정보를 추가한 언어임   
  - JS 엔진에 의해 실행되기 전에 타입 정보가 제거됨 → 즉, 작성 및 배포 과정에서 **추가 작업** 필요  
  - 그 추가 작업이 가치가 있는가? → **충분히 가치 있음**  
  
### 자동 완성 및 코드 편집 중 오류 감지  
- TypeScript는 코드 작성 시 자동 완성과 오류 감지 제공  
- **예시 1: 오타, 잘못된 타입, 인수 누락**  
  - 존재하지 않는 속성에 접근 시 오류 표시. 자동 완성에서 안보임  
  - 잘못된 타입의 메서드 호출 시 오류 표시  
  - 필수 인수가 누락된 경우 오류 표시  
  - 잘못된 타입의 인수를 전달한 경우 오류 표시  
- **예시 2: 함수 반환값 오류**  
  - 반환값이 정의된 타입과 일치하지 않으면 오류 표시  
  - 예를 들어, 반환값이 `string[]`인데 반환 타입이 `string`으로 정의된 경우 오류 발생  
- **예시 3: 선택적 속성 처리 오류**  
  - 선택적 속성을 반환 값으로 사용할 경우 타입이 일치하지 않으면 오류 표시  
- **예시 4: switch 문에서 case 누락**  
  - switch 문의 모든 case가 처리되지 않으면 오류 발생  
  - 남은 값이 `never` 타입이어야 한다는 요구사항 위반 시 오류 발생  
- **예시 5: 코드에서 특정 경우 처리 오류**  
  - 특정 값에 따라 분기 처리 시 잘못된 경우 오류 발생  
  - 예를 들어, 특정 객체 타입에 존재하지 않는 속성 접근 시 오류 발생  
  
### 함수 매개변수 및 반환 타입 명시 → 좋은 문서화 역할  
- TypeScript는 함수의 매개변수 및 반환 타입을 명시할 수 있음  
- 코드 이해도 및 유지 보수성 향상  
- 함수의 인자와 반환값이 어떤 타입인지 명확하게 드러남  
  
### 코드 리팩토링 강화  
- TypeScript는 코드 리팩토링을 더 안전하게 수행하도록 도와줌  
- 메서드 이름 변경 시 모든 연결된 코드에서 안전하게 반영됨  
- 코드의 연결 관계를 정확하게 파악할 수 있음  
  
### TypeScript 사용은 더 쉬워짐  
- TypeScript 실행 및 컴파일이 쉬워짐  
- Node.js, Deno, Bun 같은 플랫폼에서 직접 TypeScript 실행 가능  
- Vite 같은 번들러는 TypeScript를 기본 지원  
- 타입 제거(type stripping) 기법 도입 → 타입 정보만 제거하고 다른 변환 없음  
- npm 패키지 배포 개선됨 → JavaScript 및 타입 선언 파일 자동 생성 지원  
  
### TypeScript의 단점  
- 학습 곡선 존재 → JavaScript보다 복잡함  
- 일부 npm 패키지에서 타입 정의가 없거나 잘못된 경우 문제 발생 가능  
- `tsconfig.json` 설정이 복잡할 수 있음  
    - 최대한 엄격한 설정으로 설정하면 문제 완화 가능  
    - 타입 제거가 명확해지면서 `tsconfig.json`의 역할이 단순화됨  
  
### TypeScript FAQ  
#### TypeScript 코드가 무겁지 않은가?  
- TypeScript는 타입 추론을 통해 최소한의 타입 정의로도 코드 작성 가능  
- 복잡한 타입 주석 없이도 유용하게 작동 가능  
#### TypeScript가 JavaScript를 C# 또는 Java로 바꾸려는가?  
- 초기에는 JavaScript의 부족한 기능을 보완하기 위해 클래스, 모듈, 열거형 등 추가  
- 현재는 ECMAScript 표준에 맞춰 TypeScript를 개선하고 있음  
- JavaScript에 없는 기능은 TypeScript에 추가되지 않음  
#### TypeScript가 객체 지향 프로그래밍(OOP)만 지원하는가?  
- TypeScript는 함수형 프로그래밍 패턴도 잘 지원함  
- 예를 들어, `discriminated union`은 함수형 프로그래밍에서 자주 사용됨  
#### 복잡한 타입 정의는 꼭 배워야 하는가?  
- 대부분의 TypeScript 사용은 간단한 타입 정의로 충분함  
- 복잡한 타입 정의는 라이브러리 작성 시 유용하지만 일반적인 사용에서는 필요 없음  
#### TypeScript 학습에 얼마나 걸리는가?  
- 기본 개념은 하루 만에 학습 가능  
- 간단한 코드 작성 및 디버깅은 다음 날부터 가능  
- 점진적으로 복잡한 타입 및 고급 기능 학습 가능  
  
### 다음에 읽을 자료  
- [What is TypeScript?](https://2ality.com/2025/02/what-is-typescript.html)  
- [Tackling TypeScript](https://exploringjs.com/tackling-ts/) (무료)

## Comments



### Comment 36347

- Author: skrevolve
- Created: 2025-03-26T02:28:19+09:00
- Points: 1

강타입 주는 이점이 있어요 c++에서도 마찬가지

### Comment 36344

- Author: slowandsnow
- Created: 2025-03-25T23:54:13+09:00
- Points: 1

자바스크립트->타입스크립트 쓰면 눈 감고 개발하다가 눈 뜬 느낌. 타입이 주는 안정감과 자동완성, 코파일럿과의 조합

### Comment 36328

- Author: bungker
- Created: 2025-03-25T14:23:41+09:00
- Points: 1

우리회사 팀들 자바스크립트로 충분하다 하면서 프로젝트했다가 지금 타입스크립트로 모두 전환중입니다

### Comment 36325

- Author: tsboard
- Created: 2025-03-25T13:18:24+09:00
- Points: 1

자바스크립트를 대체하는 것이 아닌 보완하는 것, 이 것이 타입스크립트가 Dart를 이긴 성공 요인인 것 같습니다. 정말 배우길 잘했다는 생각이 듭니다.