자바스크립트와 타입스크립트의 차이점👉

Javascript와 Typescript

다양한 분야에 쓰이는 자바스크립트
타입스크립트는 왜 나왔을까?

• 타입스크립트는 자바스크립트의 슈퍼셋(상위호환)
  따라서, 타입스크립트는 자바스크립트의 모든기능을 제공한다.
• 웹에서 실행되는 거의 유일한 언어가 자바스크립트이기 때문에
  공생하는 전략을 취하는 타입스크립트
• 타입 = 데이터 타입을 명시 👉 명시적인 데이터 유형 설명.
  자바스크립트는 제공하지 못한다.
• 타입스크립트를 배우는건 자바스크립트를 배우는것과 일맥상통 + 타입스크립트만의 기능

let age = 10;
//변수이름에 따라 유추... 나이구나...
let x = 10;
//유추가 안됨
let weight = 80;
//weight가 숫자인지 문자인지는 모른다.
let weight:number = 80;
//typescript는 위 방식으로 데이터 타입을 숫자 유형으로 명시해줍니다.
//콜론(:)뒤에 데이터 타입 설명
let height:number = 176;
//위와 같은 경우는 단위를 모른다. 
type Centimeter = number;
//타입을 따로 명시 해준 뒤, 센티미터는 넘버!
let height:Centimeter = 176;
//그 타입을 변수에 명시해줄 수 있습니다.
type RainbowColor = 'red'|'orange'|'yellow'|'green'|'blue'|'indigo'|'violet';
let color: RainbowColor = 'orange';
//컬러의 타입은 레인보우컬러가 됩니다.
color = 'black' //=> 이렇게 하면 color의 타입을 RainbowColor로 명시해줬기 때문에 오류가 납니다. 7가지 문자열에 black이 포함되지 않기 때문입니다.

코드가 명확해지며, 코드를 이해하는 데 도움이 돼 버그를 줄이고 수정하는데 용이합니다.

이런작업들은 typescript가 transfiler이기 때문입니다. 트랜스파일러는 상, 하위 버전의 자바스크립트가 호환될 수 있도록 언어를 변환해주는 것을 말합니다.

기존 babel과 같은 도구가 있었어서 타입스크립트가 이질감이 적었습니다.
이 외에도 표현할 수 있는 방식이 더 많기 때문에 많은 회사에서 타입스크립트를 채택합니다.

출처 : 김민태의 프론트엔드 아카데미