타입스크립트의 사용 이유와 동작 원리

 

타입스크립트의 동작 원리에 대해서 알아보기 전, 타입 시스템을 먼저 알아보자.

 

타입 시스템

언어에서 사용할 수 있는 아주 여러가지 값들을 어떤 기준으로 묶어서 타입으로 정할지 결정하고 또 코드의 타입을 언제 검사할지 그리고 어떻게 검사할지 등의 우리가 프로그래밍 언어를 사용할때 타입과 관련해서 지켜야 하는 규칙들을 모아둔 체계. 쉽게 말해서, 타입 시스템은 언어의 타입 관련된 문법 체계.

 

크게 두 가지로 나눌 수 있다.

 

정적 타입 시스템 : 코드 실행전에 모든 변수의 타입을 고정적으로 결정한다.

동적 타입 시스템 : 코드를 실행하기 전에는 타입을 결정하지 않고 코드를 실행하고 나서 그때 그때마다 유동적으로 변수의 타입을 결정한다.

 

정적 타입 시스템은 엄격하고 고정적인 시스템이라고 볼 수 있고, 동적 타입 시스템은 자유롭고 유연한 시스템

 

자바스크립트가 사용하는 동적 타입 시스템은 기본적으로 변수의 타입들을 코드가 실행 되는 도중에 결정하기 때문에 우리가 미리 변수에 타입을 설정하지 않아도 된다는 유연함이 장점이다.

 

let a = "hello" // 문자열
a = 20010226 // 숫자

 

자바스크립트에서 동적 타입 시스템 적용으로 인하여 변수의 타입이 하나로만 고정되지 않는다. 즉, 아무타입의 값이나 자유롭게 담을 수 있게 된다.

 

이러한 동적 타입 시스템에는 큰 단점이 하나 있다.

let a = "hello" // 문자열
a = 20010226 // 숫자

a.toUpperCase();

위와 같이 코드가 작성된다면? (* toUpperCase() 함수는 문자열을 대문자로 바꿔주는 문자열 전용 메서드)

---> 실행은 되지만 오류가 발생한다. 그리고 프로그램이 비정상적으로 종료된다.

 

근데 오히려 이렇게 비정상적으로 종료될 코드라면, 실행시간 이전에 검사를 하여 실행되지 않도록 막는것이 더 좋은방법 아닐까? 라는 생각이 타입스크립트의 등장 배경이다.

 

그럼 정적 타입시스템이 무조건 좋은거 아닌가? 라고 생각할 수 있다.

하지만, 정적 타입 시스템 역시 단점이 있다. --> 모든 변수에 일일히 타입을 지정해줘야 해서, 귀찮을뿐더러 코드의 양이 늘어난다.

 

타입스크립트는?

자바스크립트의 동적 타입 시스템과 자바의 정적 타입 시스템을 혼합한 것 같은 그런 독특한 타입시스템을 사용.

구체적으로 설명하자면, 정적 타입 시스템처럼 변수의 타입을 코드 실행 전에 결정하고 타입 오류가 없는지 프로그램 실행전에 코드를 검사한다.

 

다행인건, 정말로 java, c 같은 정적 타입 시스템처럼 모든 변수에 대해 일일히 타입을 선언해 주지는 않아도 된다는 것이다. 위 사진에서 알 수 있듯, 이번에는 변수 a의 타입을 정의하지 않았는데도  불구하고 변수 a를 숫자 타입으로 자동으로 인지해서 코드에 오류가 있음을 빨간줄로 알려준다.

 

타입스크립트에서는 변수의 타입을 우리가 직접 정의 하지 않아도 변수에 담기는 초기값을 기준으로 자동으로 타입을 알아서 추론하기 때문이다.

 

이런 타입시스템을 점진적 타입 시스템 이라고 하며, 영어로는 Gradual Type System 이다.

 

 

결론적으로 타입스크립트의 이런 독특한 타입 시스템은 동적 타입 시스템의 타입 안전하지 않은 문제를 해결하면서도 정적 타입 시스템의 귀찮음도 동시에 해결하는 편의성을 제공해주기 때문에, 이제는 무조건적으로 타입스크립트에 대해 공부하고 잘 사용할 수 있는 것이 매우 중요하다고 생각한다.

 

타입스크립트의 동작 과정

 

1. 다른 언어들과 동일하게 먼저 타입스크립트 코드를 AST로 변환한다.

2. 그 다음 AST를 바이트코드로 변환하는게 아니라 이 AST를 보고 코드 상에 타입 오류가 없는지 검사하는타입 검사가 수행된다.

3. 만약 이때 우리가 코드를 잘못 작성해서 코드에 타입 오류가 있었다면 타입 검사가 실패하고 컴파일이 중단된다.

4. 만약 타입 오류가 없는 정상적인 코드라면 타입 검사를 성공적으로 통과하고 그 다음에는 AST를 바이트코드가 아니라 ‘자바스크립트 코드’로 변환한다.

5. 컴파일이 종료된다.

 

대부분의 언어를 컴파일 하면 바이트코드가 만들어지는 것과는 다르게 타입스크립트를 컴파일하면 자바스크립트 코드가 만들어진다.

타입스크립트 코드의 컴파일 과정에 타입 검사가 포함되어 있기 때문에 타입 스크립트 코드를 컴파일 해서 생성한 자바스크립트 코드는 타입 검사를 통과한 자바스크립트 코드라는 것, 즉, 타입 오류가 발생할 가능성이 낮은 안전한 자바스크립트 코드라는 것이다.

 

타입 검사를 통과하였다면, 타입 관련 문법들은 삭제된 안전한 자바스크립트 코드로 변경된다.

 

결국 타입스크립트는 컴파일 결과 타입 검사를 거쳐 자바스크립트 코드로 변환되는데 이때 만약 코드에 오류가 있다면 컴파일 도중 실패하게 되므로 자바스크립트를 보다 더 안전하게 사용하는 미리 한번 코드를 검사하는 용도로 사용된다.