1. 타입스크립트란?
타입스크립트는 기존의 자바스크립트를 더 안전하게 사용할 수 있도록 타입 관련된 기능들을 추가한 언어이다. 쉽게 말해 자바스크립트의 확장판이라고 할 수 있다.
이처럼 타입스크립트는 자바스크립트 코드에서 타입을 정의하는 문법만 추가하면 된다. 즉, 기존 자바스크립트 문법은 그대로 쓰고 거기에 타입 문법만 추가해주는 것이다.
💡 타입스크립트는 왜 나오게 된걸까?
기존 웹 브라우저에서만 동작하던 자바스크립트가 Node.js가 등장한 이후 다양한 프로그램에서 사용할 수 있게 되었고 장점인 유연성이 오히려 버그를 많이 일으키는 단점이 되면서 조금 더 엄격한 문법이 필요해지기 시작했다. 즉, 타입스크립트는 복잡하고 규모가 큰 프로그램을 만들 때 자바스크립트를 더 안정적으로 사용할 수 있도록 하기위해 나왔다고 볼 수 있다.
2. 타입 시스템
2.1 타입 시스템이란?
- 언어에서 사용할 수 있는 여러가지 값들을 어떤 기준으로 묶을지, 언제 검사할지, 어떻게 검사할지등 프로그래밍 언어를 사용할 때 타입과 관련해서 지켜야하는 규칙들을 모아둔 체계이다.
- 쉽게말해 타입과 관련된 문법 체계라고 할 수 있다.
- 타입 시스템은 크게 정적 타입 시스템과 동적 타입 시스템으로 나뉜다.
2.2 동적 타입 시스템
- 코드 실행 전 타입을 결정하지 않고 코드를 실행하고 그때 그때 유동적으로 변수의 타입을 결정한다.
- Python, JavaScript 등등...
- 기본적으로 변수의 타입들을 코드가 실행 되는 도중에 결정하기 때문에 미리 변수에 타입을 설정하지 않아도 되기 때문에 유연하다는 장점을 가지고 있다.
- 변수가 어떤 하나의 타입으로 고정되지 않고 변수에 담긴 값에 따라 타입이 동적으로 변경된다.
동적 타입 시스템은 유연하다는 장점도 있지만 단점도 존재한다.
사진 예제와 같이 숫자타입으로 된 변수에 문자열에서만 사용할 수 있는 메서드를 사용했을 때 실행은 되지만 그 결과 에러가 발생한다.
이렇게 간단한 코드에서는 실행과 동시에 오류가 발생하고 그에따라 수정하면 되지만 규모가 커지고 코드의 양이 방대해지면 이러한 오류들이 실행과 동시에 발생하지 않고 처음에는 동작하다가 나중에 예상치 못한 오류가 발생하는 상황이 생길 수도 있다.
2.3 정적 타입 시스템
- 코드 실행 전 모든 변수의 타입을 고정적으로 결정한다.
- 변수를 선언 함과 동시에 타입도 함께 명시해 줘야한다.
- 동적 타입 시스템과 달리 코드가 실핼 되기 전 타입을 잘못 쓰지 않았는지 검사까지 모두 마치고 실행되기 때문에 오류를 사전에 방지 할 수 있는 장점이 있다.
- 하지만 모든 변수에 타입을 정의해줘야 하기때문에 코드가 더 방대해지는 단점이 있다.
2.4 타입스크립트의 타입 시스템
- 타입스크립트는 동적 타입 시스템과 정적 타입 시스템을 혼합한것 같은 독특한 타입 시스템을 사용한다.
- 정적 타입 시스템과 같이 변수의 타입을 코드가 실행되기 전에 결정하고 타입 오류가 없는지 검사한다.
- 동적 타입 시스템과 같이 변수에 담기는 초기값을 기준으로 자동으로 타입이 추론되기 때문에 변수 타입을 직접 정의하지 않아도 된다.
- 점직적으로 타입이 정의된 변수들에 대해서는 타입을 미리 결정하고 타입이 정의되지 않은 변수에는 자동으로 타입을 추론한다.
- 이러한 특징의 타입 시스템을 점진적 타입 시스템(Gradual Type System)이라고 한다.
3. 타입스크립트의 동작 원리
3.1 프로그래밍 언어의 동작 원리
대부분의 프로그래밍 언어는 컴퓨터 보다는 인간에게 더 친화적이다. 컴퓨터는 바이트코드, 기계어, 이진수와 같이 단순한 형태의 언어를 기반으로 동작하기 때문에 프로그래밍 언어를 이해하지 못한다. 따라서 우리가 작성한 코드를 실행하기 위해서는 코드를 자기가 해석하기 쉬운 형태로 변환하는데 이것을 컴파일이라고 한다. 이렇게 컴파일 된 코드를 컴퓨터가 읽고 실행하는 것이다.
💡 자바스크립트의 컴파일 과정
❓AST(추상 문법 트리)란?
코드의 공백이나 주석, 탭 등의 코드 실행에 관계없는 요소들을 전부 제거하고 트리 형태 자료구조에 코드를 쪼개 저장해 놓는 형태를 말한다.
3.2 타입스크립트의 컴파일 과정
- 타입스크립트 컴파일러는 다른 프로그래밍 언어와 달리 AST를 바이트 코드로 변환하는 것이 아닌 타입 오류 검사를 수행한다.
- 이때 코드에 오류가 있다면 검사가 실패하게 되고 컴파일이 종료된다.
- 오류가 없는 코드라면 검사가 성공되고 자바스크립트 코드로 변환된다.
- 이렇게 타입스크립트의 컴파일 결과로 만들어진 자바스크립트 코드는 Node.js나 웹 브라우저로 실행하면 자바스크립트 컴파일 과정을 거쳐 실행된다.
- 즉, 타입스크립트는 타입 검사를 통과한 안전성 있는 자바스크립트 코드라고 할 수 있다.
📌
'Front-end > TypeScript' 카테고리의 다른 글
[TS] 타입을 추론하고... 단언하고... 좁히고... (0) | 2024.02.19 |
---|---|
[TS] 타입 별칭(type) vs 인터페이스(interface) (1) | 2024.02.18 |
[TS] 타입은 집합이다? (1) | 2024.02.17 |
[TS] 타입스크립트의 기본 타입 (0) | 2024.02.16 |
[TS] 타입스크립트 컴파일러 옵션 알아보기 (0) | 2024.02.15 |