[TS] 타입스크립트(TypeScript)

⚡ 타입스크립트는?

위키백과에 따르면 타입스크립트는 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어라고 한다. 마이크로소프트에서 개발 유지하고 있으며 자바스크립트와 다르점으로는 엄격한 문법을 지원하는 점이 다르다. 타입스크립트는 자바스크립트 엔진을 사용하면서 커다란 어플리케이션을 개발할 수 있게 설계된 언어라고 하는데 그럼에도 자바스크립트의 슈퍼셋이기에 자바스크립트로 작성된 프로그램이 타입스크립트 프로그램에서 작동하는 것도 볼 수 있다.

타입스크립트는 자바스크립트와 다르게 자신이 원하는 타입을 정의할 수 있고, 구동은 자바스크립트로 컴파일 되서 실행할 수 있는 오픈 소스라고 할 수 있다. 그렇다면 자바스크립트를 써도 될 텐데 왜 이걸 쓰는 것일까?

타입스크립트는 자바스크립트와 다르게 자신이 원하는 타입을 정의할 수 있고, 구동은 자바스크립트로 컴파일 되서 실행할 수 있는 오픈 소스라고 할 수 있다. 그렇다면 자바스크립트를 써도 될 텐데 왜 이걸 쓰는 것일까? 그 이유는 다음에서 살펴보자.

우리는 왜 타입스크립트를 사용해야 하는가?

• 수준 높은 코드 탐색과 디버깅 : 타입스크립트에서는 목적을 명시하기때문에 그에 맞지 않은 것들은 에러를 발생시킨다. 이렇게 버그가 발생됨으로써 우리는 사전에 버그를 제거할 수 있게 되기 때문이다. 또한 코드 자동완성이나 실행 전 피드백을 제공함으로써 작업과 동시에 디버깅이 가능해 생산성을 높일 수 있다고 한다.
• 자바스크립트 호환 : 자바스크립트와 100% 호환이 되는 타입스크립트는 백엔드 혹은 프론트엔드 그 어디에서든 사용이 가능합니다. 타입스크립트는 웹가 앱에서 자바스크립트와 동일하게 사용할수 있으며 위에서 안내한 커다란 어플리케이션을 개발하는데에 빛을 발한다.

이처럼 타입스크립트를 사용하면 좋은 점에 대해 알아보았는데, 어떻게 전환하면 좋을 지도 생각해볼 수 있다. 우리가 값자기 모든 JS를 TS로 바꾸려고 한다고 생각하면 이때 TS의 타입 추론이 빛이 날 것 같다.

별도로 타입을 명시하지 않아도 타입스크립트에서는 담긴 값을 보고 타입을 추론하여 지정해 줄 수 도 있고, 다른 언어처럼 정확하게 타입을 명시하여 타입을 지정할 수도 있다. 또 객체와 같이 담긴 값에 다 타입이 다른 경우를 대비해 내가 타입 형태를 미리 만들어 사용할 수 있다. 다음의 예시를 한번 살펴보자

타입 추론

let num = 2; // 추론을 통해 num타입이 Number로 지정된다. num에 숫자가 아닌 다른 타입의 값은 담길 수 없다.

타입 명시

let num:number = 2; // 타입을 명시해준다.
const words:string = "짱구";

타입 설정하기

interface IUser {
	name: string;
    age: number | string; // 넘버 혹은 스트링 타입
    school?: string;
}

let user:IUser {
	name: "철수",
    age: 12살,
}

console.log(user);


// ? 표시가 있으면 객체에 해당 타입을 붙일때, ?가 붙은 키를 필수로 입력하지 않아도 된다는 뜻이다.
// 물음표가 없으면 해당 타입의 객체를 생성할때, 필수로 키 값을 써야하는데 ?를 붙이면 안그래도 된다.