ts-for-jsdev
  • 자바스크립트 개발자를 위한 타입스크립트
  • 들어가며
  • 01 타입스크립트 소개
    • 1.0 들어가며
    • 1.1 정적 타입 분석
    • 1.2 왜 타입스크립트인가
    • 1.3 타입스크립트의 구성요소
    • 1.4 타입스크립트의 역사
  • 02 ECMAScript
    • 2.0 ECMAScript
    • 2.1 블록 수준 스코프
      • 2.1.1 let을 이용한 선언
      • 2.2.2 const를 이용한 선언
      • 2.2.3 스코프 베스트 프랙티스
    • 2.2 객체와 배열
      • 2.2.1 비구조화 할당
      • 2.2.2 나머지 연산자와 전개 연산자
      • 2.2.3 객체 리터럴 변경사항
    • 2.3 함수
      • 2.3.1 기본 매개변수
      • 2.3.2 화살표 함수
    • 2.4 템플릿 리터럴
      • 2.4.1 멀티라인 문자열
      • 2.4.2 문자열 치환
    • 2.5 원소 순회
      • 2.5.1 forEach 메소드
      • 2.5.2 for-of 문법
      • 2.5.3 이터레이터 프로토콜
      • 2.5.4 이터러블 프로토콜
    • 2.6 비동기 처리
      • 2.6.1 프로미스
      • 2.6.2 Async / Await
    • 2.7 맺으며
  • 03 타입스크립트 기초 문법
    • 3.0 타입스크립트 기초 문법
    • 3.1 기본 타입
    • 3.2 배열과 튜플
    • 3.3 객체
    • 3.4 타입 별칭
    • 3.5 함수
    • 3.6 제너릭
    • 3.7 유니온 타입
    • 3.8 인터섹션 타입
    • 3.9 열거형
  • 04 인터페이스와 클래스
    • 4.0 들어가며
    • 4.1 인터페이스 기초
    • 4.2 색인 가능 타입
    • 4.3 인터페이스 확장
    • 4.4 클래스
    • 4.5 클래스 확장
    • 4.6 클래스 심화
      • 4.6.1 스태틱 멤버
      • 4.6.2 접근 제어자
      • 4.6.3 접근자
      • 4.6.4 추상 클래스
    • 4.7 인터페이스와 클래스의 관계
    • 4.8 맺으며
  • 05 타입의 호환성
    • 5.0 들어가며
    • 5.1 기본 타입의 호환성
    • 5.2 객체 타입의 호환성
    • 5.3 함수 타입의 호환성
    • 5.4 클래스의 호환성
    • 5.5 제너릭의 호환성
    • 5.6 열거형의 호환성
    • 5.7 맺으며
  • 06 타입 시스템 심화
    • 6.0 들어가며
    • 6.1 타입 좁히기
    • 6.2 타입 추론
    • 6.3 타입 단언
    • 6.4 집합으로서의 타입
    • 6.5 서로소 유니온 타입
    • 6.6 맺으며
  • 07 고급 타입
    • 들어가며 (7월 2일 공개)
  • 08 모듈과 네임스페이스
    • 들어가며 (7월 16일 공개)
  • 09 실제 프로젝트에서 사용하기
    • 들어가며 (7월 30일 공개)
  • 10 유용한 라이브러리 소개
    • 들어가며 (8월 13일 공개)
    • 맺으며
  • 부록 II : 자바스크립트 언어 생태계
    • ECMAScript 언어 표준과 TC39
    • TC39 프로세스
    • 실제 예시 - Array.prototype.includes
    • 타입스크립트와 ECMAScript
Powered by GitBook
On this page
  • 타입이 있는 자바스크립트
  • 자바스크립트의 상위집합
  1. 01 타입스크립트 소개

1.0 들어가며

타입스크립트란 무엇인지 알아보고, 그 역사와 더불어 왜 타입스크립트를 배워야 하는지에 대한 근거를 제시한다.

2018년 1월 현재, 타입스크립트 홈페이지의 대문엔 다음과 같은 문장이 적혀 있다.

타입스크립트는 자바스크립트로 컴파일되는, 자바스크립트의 타입이 있는 상위집합입니다. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

이 문장에서 핵심이 되는 두 단어는 타입이 있는(typed) 과 상위집합(superset)이다.

타입이 있는 자바스크립트

먼저 타입이 있는 자바스크립트란 단어는 보다 정확히는 정적 타입 시스템(static type system)을 도입한 자바스크립트라는 뜻이다. 정적 타입 시스템이 있는 언어, 즉 정적 타입 언어(statically typed language)에서는 프로그램의 예상 동작을 타입을 통해 나타내고, 그 예상에 걸맞게 동작할 지의 여부를 타입 검사기(type checker)를 통해 실행 전에 확인할 수 있다.

예를 들어 아래와 같은 자바스크립트 코드를:

function preferTypeScript(person) {
  return person.favoriteLanguages.includes('TypeScript');
}

타입스크립트로는 아래와 같이 작성할 수 있다.

type Language = 'TypeScript' | 'JavaScript' | 'Python' | 'Rust' | 'Haskell';
interface Person {
  favoriteLanguages: Array<Language>;
}
function preferTypeScript(person: Person): boolean {
  return person.favoriteLanguages.includes('TypeScript');
}

이 코드를 지금 당장 이해할 수 없다고 해서 당황할 필요는 없다. 기본적으로는 같은 내용이지만 함수의 인자나 리턴값 등이 만족해야 할 특정 조건에 대한 정보를 추가적으로 담고 있다는 정도로만 받아들이면 충분하다. 타입스크립트 컴파일러에 의해, 이 코드는 앞서 봤던 것과 동일한 자바스크립트 코드로 컴파일된다.

function preferTypeScript(person) {
    return person.favoriteLanguages.includes('TypeScript');
}

자바스크립트의 상위집합

다음으로, 타입스크립트는 자바스크립트의 상위집합이다. 정적 타입 시스템이라는, 기존 자바스크립트에 전혀 없었던 개념을 제공함에도 불구하고 타입스크립트는 자바스크립트와 완전히 동떨어진 다른 언어가 아니다. 모든 적법한 자바스크립트 코드는 적법한 타입스크립트 코드이며, 타입스크립트는 한 글자의 추가적 타이핑도 없이 자바스크립트 코드를 이해할 수 있다. 그 뿐만 아니라 거대한 자바스크립트 프로젝트에서의 점진적인 마이그레이션 또한 지원한다.

새로운 언어를 바닥부터 만드는 대신, 그 난해함으로 악명 높은 자바스크립트 코드를 포용하는 결정에는 분명 비용이 뒤따른다. 하지만 바로 그 결정으로 인해 타입스크립트 도입의 진입 장벽은 한껏 낮아졌다. 덕분에 전세계의 수많은 자바스크립트 프로젝트는 보다 적은 노력으로도 정적 타입 분석의 이점을 누릴 수 있게 되었다.

타입스크립트는 현존하는 자바스크립트의 문제를 풀기 위해 등장했고, 그 수단으로 정적 타입 분석을 내세웠다. 그렇다면 정적 타입 분석은 무엇이며, 어떤 장점을 제공할까? 정적 타입 분석을 제공하는 여러 대체재 중 타입스크립트를 사용해야 하는 이유는 무엇일까? 또 타입스크립트는 어떤 요소들로 구성되어 있으며, 어떤 역사를 가질까?

1장에선 이런 질문들에 대해 답하고자 한다.

Previous들어가며Next1.1 정적 타입 분석

Last updated 7 years ago