[TS] 타입스크립트를 사용하는 이유

JavaScript With Syntax For Types.

 

1️⃣  타입스크립트란 ?

TypeScript is JavaScript with syntax for types.

 

-  Microsoft에서 개발한 오픈 소스 언어

-  자바스크립트의 상위 집합

-  자바스크립트의 한계를 해결

- 타입스크립트로 작성된 파일은 컴파일러를 통해 자바스크립트로 변환된다.

 

 

 

 

 

 

2️⃣  타입스크립트 동작 과정

 

타입스크립트는 인터프린터 언어가 아닌 컴파일 언어이다.

따라서, 타입스크립트로 작성된 코드가 브라우저에서 실행되려면 자바스크립트로 변환(컴파일)되어야 한다.

이 컴파일 단계에서 타입을 검사하여 사전에 오류 발견이 가능한 것이 타입스크립트의 장점 중 하나이다.

 

 

🤔 자세한 타입스크립트 컴파일러의 동작 과정 좀 더 공부해보기

 

 

 

 

3️⃣  타입스크립트를 쓰는 이유

 

타입스크립트를 본격적으로 공부하기 전, 왜 타입스크립트를 사용하는지에 대해 먼저 짚고 넘어가보자.

 

요즘 채용공고에 필수요건이나 우대사항으로 타입스크립트가 자주 보이니까?

자바스크립트의 단점을 보완하기 위해?

 

나는 타입스크립트를 배워야하는 이유에 대해 저 정도로만 알고 있었는데

타입스크립트를 사용하면 정확히 자바스립트의 어떤 단점을 보완할 수 있고 어떤 장점이 있길래

요즘 타입스크립트가 필수가 되는 추세가 되었는지 알아보자.

 

 

 

타입스크립트를 쓰는 이유

▶  동적 타입을 정적으로 선언할 수 있다.

=== 자바스크립트 ===
let a;
a = 1;
a = 'b';


=== 타입스크립트 ===
let a : number;
a = 1;
a = 'b';
// Type 'string' is not assignable to
type ‘number'.ts(2322)

 

▶  타입 유추를 통한 타입 제어가 가능하다.

=== 자바스크립트 ===
const sum = (a, b) => {
    return a + b
}
sum(1, "2") // 12


=== 타입스크립트 ===
const sum = (a: number, b: number) => {
    return a + b
}
sum(1, 2) // 3

 

▶  컴파일 시점에 오류를 포착할 수 있다.

▶  JavaScript에서 찾을 수 없는 추가 코드 기능을 제공한다.

 

 

 

 

 

타입이 필요한 이유

let text = 'javascript';
console.log(text.charAt(0));	// j

문자열에 charAt()을 이용하면 입력된 인덱스에 해당하는 문자를 반환한다.

위의 경우 인덱스 첫 번째 문자인 j가 출력된다.

자바스크립트는 동적 타이핑을 지원하기 때문에 text 변수가 선언되는 과정에서 타입이 문자형으로 지정된다.

 

 

이후 코드를 작성하는 과정에서 text 변수에 다른 값을 할당해보자.

text = 2022;
console.log(text.charAt(0));

그리고 charAt()을 이용해 첫 번째 문자를 출력하려고 하면

TypeError: text.charAt is not a function 에러가 발생한다.

 

이처럼 자바스크립트는 타입이 없기 때문에 실행 후에 타입 에러를 확인할 수 있다.

반면, 타입스크립트는 같은 코드에 대해 실행을 하기 전 미리 에러를 확인할 수 있다.

 

정리하자면, 자바스크립트의 런타임 단계에서 발생하는 타입 에러를 타입스크립트를 이용한다면 컴파일 단계에서 미리 확인하고 고칠 수 있다.

 

런타임 단계에서 발생하는 에러로 인해 프로그램이 멈춘다면, 운영되는 서비스에 큰 차질이 생길 수 있기에 치명적이다.

따라서 타입스크립트를 이용한다면 타입 에러와 같은 개발자의 실수를 미리 방지할 수 있다는 장점이 있다.

 

 

 

 

 

4️⃣  클린코드와 타입스크립트

 

클린 코드란 말 그대로 깨끗하게 작성된 코드를 의미한다.

깨끗하게 작성된 코드란 직접적이고 단순하여 읽기가 쉽고, 코드 작성자가 아닌 누가 보더라도 의도가 명확히 드러나는 코드이다.

이러한 코드는 가독성이 좋고, 의존성을 최대한 줄여 유지보수가 쉬운 특징이 있다.

 

프로그래머는 작성 기한을 맞추기 위해서 나쁜 코드를 양산하게 될 경우가 있을 수 있다.

하지만 나쁜 코드를 양산하면 오히려 엉망진창인 코드 때문에 개발 속도가 느려지고 결국 기한을 맞추지 못하게 된다. 

기한을 맞추는 유일한 방법은 언제나 코드를 최대한 깨끗하게 유지하는 것이다.

 

위에서 소개한 타입이 필요한 이유처럼 타입을 정의함으로써 개발자의 실수를 줄일 수 있고,

명시된 타입을 보고 해당 변수의 자료형이 무엇인지 쉽게 이해할 수 있다.

결과적으로 어떤 용도로 코드가 작성되어있고 무엇을 의미하는지 파악하기 훨씬 용이하기 때문에

유지보수에 유리하고 자연스럽게 개발 속도도 빨라지게 된다.

 

 

 

 

 

 

 

 

 

---

 이 글은 엘리스의 AI트랙 5기 강의를 들으며 정리한 내용입니다.