이전 프로젝트부터 타입의 불일치에 대해 불편함을 많이 느꼈고 그로 인해 Typescript를 공부하게 되었다.
그럼 Javascript와 Typescript의 차이가 무엇인지, Typescript의 장점이 무엇인지 확인해보자.
동적 언어, 정적 언어라는 표현이 뭔가 와닿지 않는다.
용어 정리부터 해보자
타입 ( Type )
한글로 말하면 자료형을 뜻한다. ( 실수형, 정수형 등등 )
동적 언어
MDN 사이트의 검색 결과를 확인해보면 특정 타입과 연결되지 않는 언어를 동적 언어라고 표현한다.
정적 언어
자료형을 컴파일 시에 결정하는 것을 뜻한다.
컴파일, 뭔가 어려운 단어가 나왔다.
다음 항목에서 확인해보자.
단어 정리는 거의 끝난 것 같다.
표를 통해 Javascript와 Typescript를 구분해보자.
Javascript | Typescript |
---|---|
동적 언어 | 정적 언어 |
배우기 쉬움 | 배우기 까다로움 |
코드가 비교적 짧음 | 작성해야할 코드가 길어짐 |
Runtime에 자료형이 정해짐 | Compile Time에 자료형이 정해짐 |
표에서 Bold체로 표기한 부분들이 바로 Typescript를 사용하는 목적이다.
그럼 Typescript가 어떻게 장점이 있는지 다음 blog 자료를 통해 확인해보자.
// 두 수를 더해서 console로 출력하는 함수
function sum( a, b ){
const total = a + b;
console.log( `console : ${total}` );
}
function sum( a, b ){
const total = a + b;
console.log( `console : ${total}` );
}
sum( 'x', 'y' ); // console : xy
sum( 1, 2 ); // console : 3
sum( 1, 'x' ); // console : 1x
function sum( a : number, b : number ){
const total = a + b;
console.log( `console : ${total}` );
}
sum( 'x', 'y' ); // error
sum( 1, 2 ); // console : 3
sum( 1, 'x' ); // error
다음과 같은 Object
가 선언되어있다.
const pserson = {
name : "jigom",
age : 35
}
동적 언어와 정적 언어 둘다 person.nickname
이라는 속성을 출력해보자
// 동적 언어 : Javascript => 실행해야 에러 발생
console.log( person.nickname );
// 정적 언어 : typescript => IDE 에서 오류를 발견
console.log( person.nickname );
개발 시 생산성 향상
앞으로 Typescript를 공부하면서 정리할 예정이다.
참고 자료