타입스크립트는 자바스크립트에 타입을 부여한 언어.
자바스크립트의 확장된 언어라고 볼 수 있음.
타입스크립트는 자바스크립트와 달리 브라우저에서 실행하려면 파일을 한번 변환(컴파일)해줘야 한다.
왜 타입스크립트를 써야하는가?
1. 에러의 사전방지
두 코드 모두 두 숫자의 합을 구하는 함수코드, 하나는 자바스크립트로, 다른 하나는 타입스크립트로 작성함.
이 함수를 가지고 실제 코드를 작성해보면?
//math.js
function sum(a, b) {
return a + b
}
sum(10, 20); // 30
sum('10', '20'); // 1020
// => 의도하지 않은 코드의 동작이 발생한다.
//math.ts
functon sum(a: number, b: number) {
return a + b
}
sum('10', '20') // error: '10'은 number에 할당될 수 없다. -> 예방가능
2. 코드 가이드 및 자동 완성(개발 생산성 향상)
개발툴의 기능을 최대로 활용할 수 있음.
vscode의 경우 툴의 내부가 타입스크립트로 작성되어 있어 타입스크립트 개발에 최적화되어 있음.
예)
function sum(a, b) {
return a + b
}
let total = sum(10, 20);
total.toLocaleString();
// 개발자 스스로가 sum()함수의 결과를 예상하고 타입이 number라고 가정한 상태에서 number의 API인 toLocalString()을 코딩하게 된다. => 개발자가 일일이 작성해야하고, 오타가 날 경우 해당 파일을 브라우저에서 실행했을 때만 오류를 확인할 수 있다.
예) -> 타입스크립트로 작성하게되면?
function sum(a: number, b: number): number {
return a + b;
}
let total = sum(10, 20)
total.toLocaleString();
// 변수 total에 대한 타입이 지정되어 있기 때문에 해당 타입에 대한 api를 미리 보기로 띄워 줄 수 있고, tab으로 빠르고 정확하게 작성해나갈 수 있음.
persistently