자바스크립트는 동적 타입 언어다. 따라서 변수의 타입은 런타임에 결정된다.
이와 반대인 정적 타입 언어도 존재한다. 정적 타입 언어는 변수의 타입이 컴파일 타임에 결정된다. 동적 타입 언어에는 파이썬(Python), PHP 등이 있고, 정적 타입 언어에는 자바(Java), C++ 등이 있다.
우리는 이번 정리에서 정적 타입 언어인 타입스크립트에 대해 알아볼 것이다.
타입스크립트란?
타입스크립트는 자바스크립트의 모든 기능을 포함하면서 정적 타입을 지원하는 언어다.
그렇다면 왜 자바스크립트에 정적 타입이 필요할까?
자바스크립트에 정적 타입을 추가해 주는 언어와 도구는 Elm, ReasonMl, PureScript, Flow 등 다양하다.
동적 타입 언어와 정적 타입 언어
- 동적 타입 언어의 특징
- 타입에 대한 고민을 하지 않아도 되므로 배우기 쉽다.
- 코드의 양이 적을 때 생산성이 높다.
- 타입 오류가 런타임 시 발견된다.
- 정적 타입 언어의 특징
- 변수를 선언할 때마다 타입을 고민해야 하므로 진입 장벽이 높다.
- 코드의 양이 많을 때 동적 타입 언어에 비해 생산성이 높다.
- 타입 오류가 컴파일 시 발견된다.
정적 타입 언어가 생산성이 높은 이유?
정적 타입 언어의 코드는 타입으로 서로 연결되어 있다. 덕분에 연관된 코드 간의 이동이 쉽고, 변수명이나 함수명을 변경하는 등의 리팩토링도 쉽다. 임포트(import)하지 않고 코드를 작성해도 단축키 한 번이면 IDE가 필요한 임포트 코드를 자동으로 넣어준다.
함수를 호출하기 위해 함수 이름과 괄호를 입력하면 함수의 매개변수 종류와 반환값의 타입을 확인할 수 있다. 속성 값의 종류가 많은 객체라 하더라도 객체 이름과 점을 입력하면 속성 값 목록을 확인할 수 있다.
타입스크립트의 사용
타입스크립트를 실습하기에 앞서 Typescript 링크를 누르면 실습할 수 있는 공간이 나온다. 여기에서 코드를 입력해보자.
let v1 = 123;
v1 = 'abc'; // type error변수 v1에 마우스를 올려보면 let v1: number라는 문구가 보이고, 이것은 v1 변수가 타입이 숫자라는 것을 알려준다. 2열에서 숫자가 아닌 문자열을 입력하면 컴파일 타임에 에러가 발생한다. 즉, 코드를 실행해 보기도 전에 타입 에러를 확인할 수 있다.
위에서처럼 타입을 명시적으로 입력하지 않아도 타입스크립트가 숫자 타입으로 인식하는 것을 확인했다. 이렇게 자동으로 타입을 인식하는 기능을 타입 추론(type interface)라고 한다.
타입 추론 덕분에 기존의 자바스크립트 코드를 크게 변경하지 않고도 타입스크립트를 비교적 쉽게 적용할 수 있다.
타입스크립트에서 타입을 선언하는 방법
자바스크립트는 동적 타입 언어이므로 아래처럼 작성할 수도 있다.
let v1 = 123;
v1 = 'abc';하지만 타입스크립트에서는 변수 v1의 타입이 숫자이거나 문자열일 수 있다면 다음과 같이 명시적으로 타입 정보를 입력해야 한다.
let v1: number | string = 123;
v1 = 'abc';변수 v1을 숫자나 문자열인 타입으로 정의했다. 따라서 위의 코드에서는 2열에서 타입에러가 발생하지 않는다.
다음 포스트에서는 타입스크립트를 직접 사용해보면서 여러가지 타입에 대해 알아보겠다. 뿅~!!
