[Typescript] Typescript 시작하기

자바스크립트는 매우 훌룡한 언어다.

상당히 유연하고 자유로우며, 범용성 또한 넓다.

 

하지만, 때로는 이러한 장점들이 문제가 되는 경우도 종종 존재한다.

 

그러면 자동적으로 이런 생각이 떠오를것이다.

자바스크립트의 장점은 챙겨가면서, 필요할 때는 엄격한 그런 언어는 없는지..

 

Typescript는 이러한 고민을 한번에 해결해준다.

 

이 글에서 알아볼 것

• Typescript 란?
• Typescript의 장점
• Typescript 시작하기

 

1. Typescript 란?

• 타입스크립트는 자바스크립트 슈퍼셋(Superset)이다.
  • 즉, 타입스크립트는 자바스크립트를 기반으로 하는 프로그래밍 언어다
  • 자바스크립트 장점 + 새로운 기능 추가

자바스크립트도 이미 충분히 훌룡한데,

거기에서 장점은 챙기고 단점은 보완하며 새로운 기능까지 추가된 타입스크립트는 완벽한 언어일까?

 

당연히 단점도 존재한다.

• 타입스크립트 단점
  • 자바스크립트를 실행할수 있는 환경에서는 타입스크립트가 지원되지 않는다.
    • 타입스크립트는 자바스크립트와 달리 브라우저 환경에서 실행할 수 없다
    • 또한, Node도 타입스크립트를 실행할 수 없다
  • 도대체 자바스크립트 기반이라면서 자바스크립트 환경에서는 실행 못한다는 건 무슨말일까?…또한 이런 단점이 존재하므로 좋지 못한 언어일까?… 아니다
• 타입스크립트는 툴(컴파일러)이다
  • 타입스크립트는 언어이기도 하지만, 타입스크립트 코드를 자바스크립트 언어로 컴파일 해주는 강력한 컴파일러이기도 하다

 

그래서 결과적으로 무슨 말일까?

• 새로운 기능과 자바스크립트의 장점을 갖고있는 타입스크립트 코드를 작성하여 결과적으로 자바스크립트 코드를 얻을 수 있다

 

타입스크립트가 뭔지 알았다..그럼 하나의 의문이 발생한다.

• 결국 자바스크립트 기반의 언어인데, 어떻게 자바스크립트에는 없는 새로운 기능을 추가할 수 있었을까?
  • 하나 알고가야할 것이, 여기서 새로운 기능이란, 자바스크립트에서 만들수없던 기능을 새롭게 만드는것이 아닌, 자바스크립트에서 처리하기 어려운것들을 쉽게 처리해주는 기능을 말한다.
• 이걸 가능하게 만드는 것이 타입스크립트 컴파일러다
  • 복잡하고, 자바스크립트만으로 처리하기 힘든 작업을 더욱 간다한 구문인 타입스크립트로 처리해주고 컴파일 해주기 때문이다.

 

2. Typescript의 장점

 

1. type 할당
   • type을 할당해줌으로 오류를 컴파일중에 잡을 수 있다
2. 자유로운 최신 자바스크립트 문법 사용
   • 오래된 브라우저에서는 최신 자바스크립트 문법 사용에 제약이 존재하였었다.
     • babel이라는 라이브러리가 존재하긴했지만,,
   • 타입스크립트를 사용하면, 최신 문법을 오래된 브라우저에서도 호환되게 작성할수있다.
3. 인터페이스, 제네릭같은 타입스크립트만의 문법이 추가된다
   • 이러한 기능들은 에러 처리에 더 많은 도움을 준다
4. Decorators등과 같은 메타 프로그래밍 기능을 제공한다

 

3. Typescript 시작하기

 

• 설치
  • npm install -g typescript
• 실행
  1. 타입스크립트 파일 정의
  2. 터미널에서 tsc app.ts
  3. 타입스크립트 파일을 컴파일하여 app.js가 생성된다
• 추가 툴 설치를 통한 더욱 편한 개발 환경 구축
  • npm install —save-dev lite-server
    • lite-server는 package.json 파일 옆에 항상 index.html 파일을 제공하는 개발서버
    • 타입스크립트 파일의 내용을 변경하고 컴파일 후, 변경사항을 적용하기 위해 새로고침하는 작업을 생략시켜준다..자동으로 반영됨