TypeScript 소개와 개발환경 구축 하기 !

박현상(HyunSang Park)·2020년 9월 20일
0
post-custom-banner

TypeScript란?

TypeScript는 JavaScript의 슈퍼셋인 오픈 소스 프로그래밍 언어입니다. 마이크로소프트에서 개발, 유지하고 있습니다. 엄격한 문법을 가지고 있는 지원합니다.
C#의 리드 아키텍트이자 델파이와 터보 파스칼의 창시자인 Anders Hejlsberg가 개발에 참여 하였습니다.
아주아주 TypeScript는 클라이언트 사이드와 서버 사이드를 위한 개발에 사용할 수 있습니다.
이 부분이 아주아주 매력적인 부분입니다 💚

TypeScript의 장점은?

정적 타입

function sum(a, b) {
  return a + b;

함수를 정의한 개발자의 의도는 두 개의 숫자 타입(Number) 인수를 전달 받아서 그 합계를 반환하려는 것으로 추측 되고 있습니다.
하지만 코드상으로로는 어떤 타입의 인수를 전달하여야 하는지, 어떤 타입의 반환값을 리턴해야 하는지 명확하지 않습니다. 따라서 위 함수는 아래와 같이 호출될 수 있습니다.

function sum(a, b){
	return a + b;
}
sum('x', 'y'); //'xy'

위 코드는 자바스크립트 문법상 어떠한 문제도 없으므로 자바스크립트 엔진은 아무런 이의 제기없이 위 코드를 실행합니다. 숫자(Number), 문자(String) 등을 사전에 지정하지 않는 자바스크립트의 동적 타이핑(Dynamic Typeing)에 의한 것입니다.

function sum(a: number, b:number){
  return a + b
}
sum('x','y');
// // error TS2345: Argument of type '"x"' is not assignable to parameter of type 'number'.

TypeScript는 정적 타이핑(Static Typeing)을 지원하고 있으므로 컴파일 단계에서 오류를 포착할 수 있다는 장점이 있습니다. 명시적인 타입 지정은 개발자의 의도를 코드에 명확하게 녹아내릴 수 있는 기술 입니다.
이는 코드의 가독성을 높이고 예측할 수 있게 하면서 디버깅이 쉽게 됩니다.
(아주아주 편한 부분입니다 🤩)
간단하게 알려주게 되면 자바스크립트의 경우에는 동적 타이핑(Dynamic Typeing)을 사용하기 때문에 사전에 타입을 지정하지 않아도 그에 맞게 대응한다고 생각하시면 됩니다. 그리고 타입 스크립트의 경우에는 정적 타이핑(Static Typeing)을 사용하기 때문에 사전에 타입을 설정을 해 줘야 됩니다. 그에 맞게 대응하지 않고 오류를 출력하게 됩니다.

개발환경 구축

가장 첫 번째인 Node.js를 설치하는 방법은 다른 포스팅에서 소개 해 드렸습니다. Node.js를 설치하는 방법은?

$ npm install -g typescript

설치가 완료 되었으면 버전을 출력하여서 완벽하게 TypeScript의 설치를 확인 하면 됩니다.

$ tsc -v
Version 3.9.7

Shell Image
위와 같이 확인 하시면 됩니다😍
엄청 간단하고 편하죠? 다음편에서 TypeScript를 어떻게 편하게 TypeScript 컴파일 하는 TypeScript 컴파일러(TSC)에 대해서 알려드리겠습니다.

참고한 블로그

profile
🧑🏻‍💻 다양한 소프트웨어를 개발하고 있습니다
post-custom-banner

0개의 댓글