정리
타입의 종류
'타입'은 자바스크립트에서 다루는 값의 형태에 대한 설명이다. 여기서 '형태'란 값에 존재하는 속성과 메서드 그리고 내장되어 있는
typeof 연산자가 설명하는 것을 의미한다.타입스크립트의 가장 기본적인 타입은 자바스크립트의 일곱 가지 기본 원시 타입(primitive type)과 동일하다.
일곱 가지 원시 타입은 다음과 같다.
- null
- undefined
- boolean
- string
- number
- bigint
- symbol
타입 시스템
타입 시스템(type system)은 프로그래밍 언어가 프로그램에서 가질 수 있는 타입을 이해하는 방법에 대한 규칙 집합이다.
기본적으로 타입스크립트의 타입 시스템은 다음과 같이 작동한다.
- 코드를 읽고 존재하는 모든 타입과 값을 이해한다.
- 각 값이 초기 선언에서 가질 수 있는 타입을 확인한다.
- 각 값이 추후 코드에서 어떻게 사용될 수 있는지 모든 방법을 확인한다.
- 값의 사용법이 타입과 일치하지 않으면 사용자에게 오류를 표시한다.
오류 종류
타입스크립트를 작성하는 동안 가장 자주 접하게 되는 오류로 구문 오류와 타입 오류가 있다.
구문 오류
구문 오류는 타입스크립트가 코드로 이해할 수 없는 잘못된 구문을 감지할 때 발생한다. 이는 타입스크립트가 타입스크립트 파일에서 자바스크립트 파일을 올바르게 생성할 수 없도록 차단한다.
타입 오류
타입 오류는 타입스크립트의 타입 검사기가 프로그램의 타입에서 오류를 감지할 때 발생한다. 오류가 발생했다고 해서 타입스크립트 구문이 자바스크립트로 변환되는 것을 차단하지는 않습니다.
할당 가능성
타입스크립트는 변수의 초깃값을 읽고 해당 변수가 허용되는 타입을 결정한다. 나중에 해당 변수에 새로운 값이 할당되면, 새롭게 할당된 값의 타입이 변수의 타입과 동일한지 확인하고 만약 다른 타입의 값이 할당되면 타입 오류가 발생한다.
타입스크립트에서 함수 호출이나 변수에 값을 제공할 수 있는지 여부를 확인하는 것을 할당 가능성(assignability)이라고 한다. 즉, 전달된 값이 예상된 타입으로 할당 가능한지 여부를 확인한다.
타입 애너테이션
타입스크립트는 초깃값이 없는 나중에 사용할 변수의 초기 타입을 파악하려고 시도하지 않는다. 그리고 기본적으로 변수를 암묵적인 any 타입으로 간주한다.
초기 타입을 유추할 수 없는 변수는 진화하는 any라고 부른다. any 타입인 변수에 새로운 값이 할당될 때마다 변수의 타입이 변한다.
타입스크립트는 초깃값을 할당하지 않고도 변수의 타입을 선언할 수 있는 구문인 타입 애너테이션(type annotation)을 제공한다.
변수에 타입 애너테이션으로 정의한 타입 외의 값을 할당하면 타입 오류가 발생한다.
불필요한 타입 애너테이션
타입스크립트가 타입을 유추할 수 있는 변수에 타입 애너테이션을 추가하면 중복이다.
초깃값이 있는 변수에 타입 애너테이션을 추가하면 타입스크립트는 변수에 할당된 값의 타입이 일치하는지 확인한다.
많은 개발자는 아무것도 변하지 않는 변수에 타입 애너테이션을 추가하지 않기를 선호한다.
코드를 명확하게 문서화하거나 실수를 방지하기 위해 명시적으로 타입 애너테이션을 포함하는 것이 유용한 경우도 있다.
타입 형태
타입스크립트는 객체에 어떤 멤버 속성이 존재하는지 알고 있다. 그리고 객체의 형태에 대한 이해를 바탕으로 할당 가능성뿐만 아니라 객체 사용과 관련된 문제도 알려준다.
모듈
타입스크립트는 최신 모듈(
export 또는 import가 있는 파일) 파일을 기존 파일과 함께 실행할 수 있다.파일이 스크립트(모듈이 아닌 모든 파일)면 해당 파일을 전역 스코프로 간주한다. 따라서 동일한 이름의 변수가 동일한 파일에 선언된 것처럼 서로 충돌한다.
강제로 모듈이 되도록 만들고 싶으면 파일의 아무 곳에나
export {};를 추가하면 된다.타입스크립트는 일반적으로 CommonJS 스타일의
require 함수에서 반환된 값을 any 타입으로 인식한다.생각
타입스크립트가 생소했을 때는 타입 애너테이션을 모든 곳에 지정하면 좋겠다는 생각을 가지고 있었지만 불필요한 타입 검사를 실행한다는 사실을 알게 되고 난 후 최대한 타입 애너테이션의 사용을 자제하게 됐다. 그리고 vs code에서 어떤 타입인지 알려주기 때문에 굳이 타입 애너테이션을 추가하지 않더라도 타입을 잘 알 수 있다.
처음 실습할 때는 “중복된 변수명을 사용하면 왜 충돌이 나지? 다른 파일로 만들었는데?” 라는 생각을 가지면서 그냥 변수명을 다르게 지정해 줬었다. 그리고나서 모듈로 만들면 그럴 필요가 없다는 사실을 알게 된 후 모듈로 만들지 않았던 파일(스크립트)은 이름과 동일하게 HTML의
script 태그와 같은 동작 방식을 하겠구나 라는 생각을 하게 됐다.