본문 바로가기
목차
[노트장] 적으며 정리해 보는 이론/TypeScript

[TypeScript] 타입스크립트란?

by 졸린부엉이 2024. 4. 23.

 ◼ TypeScript 

2012년 마이크로소프트가 발표한 타입스크립트(TypeScript)는 자바스크립트(JavaScript)를 기반으로 동적 타입 시스템 + 정적 타입 시스템을 더한 [ 점진적 타입 시스템 ]을 가진 언어입니다. 타입스크립트는 자바스크립트의 슈퍼셋, 즉 자바스크립트 기본 문법에 타입스크립트라는 문법을 추가한 언어 입니다.

 

JS는 웹브라저를 만들기 위해 만들어진 언어 였지만, 현재는 앱, 웹을 만들게 되면서 다양한 분야의 개발이 가능해진 언어입니다. 그러다 보니

JS의 유연성으로 인해 예기치 못한 오류들이 많이 발생하게 되었습니다.

이를 보안하기 위해 확장언어도 나온 언어가 TypeScript입니다.

 

https://buttercms.com/blog/what-is-typescript/

 

 

미리 타입을 정하거나, 타입을 미리 정하지 않아도 초기화한 값의 타입으로 가지며, 잘못된 타입 입력시 에러를 내어 빠르게 문제를 파악할수 있게 도와 줍니다.

// JavaScript
let a = 1;
a = 'ok'; // 에러 X 

// TypeScript
let a = 1;
a = 'error'; // 에러 O | 숫자타입이 문자를 할당해서

 

 

 

 

 

 ◼ TypeScript 실행 과정 

TS의 컴파일을 하면 컴파일된 코드가 되는것이 아닌 JS의 언어로 컴파일이 된 후, Nodejs로 인해 다시 한번 컴파일을 거쳐 컴파일된 기계어로 변환이 됩니다.

 

[출처] - 한입만타입스크립트

 

 

 

TS에서 JS로 컴파일이 될때 타입과 관련된 코드들을 컴파일 과정에서 모두 사라집니다.

// TS
let num : number = 0;

컴파일..

// js 
let num = 0

 

 

 

 

 

 ◼ TypeScript 사용해야 하는 이유 

  • 빠르게 에러를 예방할수있습니다.
    TypeScript의 점진적 타입 기반, 즉 컴파일을 하는 과정에서 타입을 결정하게 됩니다. 변수에 들어갈 값의 형태에 따라 자료형을 지정해 주어야 하는 건데요. 컴파일 시 자료형에 맞지 않은 값이 들어가면 컴파일 에러를 발생시킵니다. 그러나 TypeScript는 컴파일 과정에서 타입을 지정하기 때문에 컴파일 에러를 예방할 수 있을뿐 아니라, 손쉬운 디버깅이 가능해집니다. 실제 연구에 따르면 모든 JavaScript 버그의 15%가 사전에 TypeScript로 감지할 수 있다고 합니다. 

  • 자동 완성, 리팩터링, 코드 탐색과 같은 지능형 기능을 제공합니다.
    Javascript로 코드를 작성할 때, 객체의 필드나 함수의 매개변수로 들어오는 값이 무엇인지 알기 위해 여러 파일을 살펴야 했지만 TypeScript를 사용한다면 변수의 이름뿐만 아니라 그 테이터의 자료형까지 알 수 있게 됩니다. 그래서 코드 작성을 쉽고 직관적으로 할 수 있습니다.

  • TypeScript는 JavaScript의 슈퍼 셋입니다. 
    TypeScript를 적용하는 경우 기존의 JavaScript로 짜인 코드에 확장하는 식으로 대규모 수정 없이도 TypeScript 적용이 가능합니다. 

 

 

 

 

 

 

 

[참고]

https://buttercms.com/blog/what-is-typescript/ 
https://www.samsungsds.com/kr/insights/typescript.html
https://ko.wikipedia.org/wiki/%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8