Typescript vs Javascript 간단 비교 - Typescript를 중심으로

Typescript vs Javascript 비교하기

1. Typescript는 Javascript의 모든 기능을 제공합니다. (Super set)

2. Typescript는 Javascript에서 더 많은 기능을 지원합니다.

Typescript라는 이름에 걸맞게 주로 type과 관련된 개선점이 주요 추가 기능입니다.

2.1  변수에 타입을 지정할 수 있습니다. (Javascript는 할 수 없습니다.)

weight와 height라는 변수를 선언할때 각 변수를 number로 타입을 정의했습니다.

let weight : number = 80;
let height : number = 176;

 

2.2 타입을 새로 만들 수 있습니다.

1. Centimeter라는 number에 해당하는 type을 정의하고

2. height에 centimeter type을 붙여주었습니다.

type Centimeter = number;
let weight : number = 80l
let height : Centimeter = 176;

이를 통해서 height가 cm 단위라는것을 코드상에서 쉽게 확인할 수 있게 되었습니다.

 

2.3 타입을 통해서 잘못된 타입이 변수에 할당되는것을 막을 수 있습니다.

1. 아래의 예시와 같이 RainbowColor를 red, orange, yellow 타입으로 정의했습니다.

2. color : RainbowColor로 선언하고, color에 black 을 할당하려고 하면 오류를 발생시킵니다.

type RainbowColor = 'red' | 'orange' | 'yellow'

let color: RainbowColor = 'orange';

color = 'black' => 'black'이라는 type을 넣을 수 없어서, 여기서 오류를 발생시킵니다.

 

Typescript는 같은 타입 정의를 바탕으로 코딩시에

타입 관련된 오류를 많이 줄여줍니다.

 

Typescript와 반대로

Javascript는 변수의 타입이 런타임에 결정됩니다.

그런 이유로 가독성은 낮아지더라도, 프로그래밍 학습 곡선이 낮고 빠르게 할 수 있는 장점이 있습니다.

 

2.4 Typescript는 최신 ECMAScript 기능을 지원하며, 구형 브라우저에서도 Javascript를 실행시킬 수 있습니다.

Typescript는 Javascript로 코드를 변환하는 과정을 해줍니다.

그것을 트랜스 파일(Transpile) 이라고 합니다.

 

그런데 Typescript의 트랜스 파일 기능중에서 최신 버전의 Javascript부터 구형 버전의 Javascript로 트랜스 파일 해주는 기능이 포함되어있습니다.

이런 기능을 활용하여 다양한 버전(특히 구형)의 브라우저에서 Javascript가 실행될 수 있도록 할 수 있습니다.