출처: https://www.typescriptlang.org/branding
타입스크립트
타입스크립트(TypeScript)는 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다.
위키백과에 서술되어 있는 타입스크립트에 대한 설명입니다. 슈퍼셋이 무슨 뜻인지 궁금해서 검색해보니 컴퓨터 과학에서 슈퍼셋이란 특정한 언어의 모든 기능을 포함하면서, 다른 기능까지 포함하도록 향상 또는 확장된 것을 의미한다고 합니다.
그 말인즉슨 타입스크립트는 자바스크립트의 모든 기능을 포함하면서, 거기에 더해서 다른 기능들이 추가된 프로그래밍 언어라는 것이죠. 실제로 타입스크립트를 사용하게 되면 여러 "타입"으로 인해 발생하는 오류를 미연에 방지할 수 있어 생산성이 향상된다고 합니다.
타입
타입스크립트의 핵심은 그 이름에서 드러나듯이 "타입"에 있습니다. number, string, boolean 과 같은 타입 말이죠.
사실 타입이라는 개념 자체는 새로운 것은 아닙니다. 자바스크립트에도 이미 있는 개념이죠. 자바스크립트를 처음 배우다 보면 typeof 를 이용해 변수나 값이 어떤 타입인지를 확인해본 경험이 있으실 겁니다.
자바스크립트는 다양한 타입을 받아들여 연산해버리는 (약간은 이상하기도 한) 유연함을 가지고 있습니다. a 라는 변수에 숫자 1 을 담고 b 라는 변수에 문자열 "1" 을 담아 이 둘을 더해도 전혀 오류 없이 결과를 도출해주죠.
const a = 1;
const b = "1";
const sum = (a, b) => a + b;
const result = sum(a, b); // result === "11"타입스크립트를 사용하면 어떤 변수에 담고자 하는 자료의 타입을 미리 지정할 수 있습니다. 그리고 만약 이런 타입을 벗어나는 입력이 들어오면 프로그래밍 단계에서부터 빨간 줄을 띄워 문제가 있다는 것을 알려주게 되죠.
사용법도 크게 어렵지 않습니다. 가장 기본적인 사용법은 변수를 선언하는 과정에서 : + type명 을 추가해주는 것인데요. 아래와 같이 코드를 작성하게 되면 b 부분에 문제가 있다는 것을 알리는 에러를 출력하게 됩니다. 링크에서 확인하실 수 있습니다.
const a: number = 1;
const b: string = "1";
const sum = (a: number, b: number) => a + b;
const result = sum(a, b); // b 에 문제가 있다는 것을 알려주게 된다.이것만이 아닙니다. 어떤 것이 함수인지를 파악할 수도 있고, 만약 객체라면 객체 안에 해당하는 키가 있는지를 파악할 수도 있다고 하는데요. 더욱 자세한 정보는 공식 핸드북 문서를 통해 확인하실 수 있습니다.
타입스크립트 써보면 좋을 것 같다.
빠르게 프로그래밍을 하다 보면 의외로 다른 타입을 함께 연산하는 실수가 생기곤 합니다. 프로그래밍 와중에 눈치채면 그나마 다행이지만, 종종 이런 실수는 코드를 작성하고 나서 테스트하는 과정에서나 발견되곤 하죠.
코드스테이츠에서 제공하는 toy 문제나 sprint 들은 이미 테스트 코드가 준비되어 있기 때문에, 테스트를 반복해가면서 작성한 코드에 어떤 에러가 있는지를 확인할 수 있습니다. 하지만 테스트를 먼저 작성하지 못하는 경우라면 이미 작성한 코드를 다시 들여다보면서 일일히 체크해야 할지도 모릅니다.
다양한 데이터의 입력을 유저들에게서 받아야 한다면 상황은 더욱 심각해질 수 있습니다. 입력이 개발자가 원하는 대로만 들어오리란 보장이 없거든요. 늘 예상치 못한 변수가 우리를 기다립니다.
때문에 개발할 때 미리 이러한 오류를 체크할 수 있다는 건 매우 큰 장점이라고 생각합니다. 공부해보니 27 기로 수료하신 분들이 왜 프로젝트 과정에서 타입스크립트를 많이들 쓰셨는지를 알 수 있었습니다. 거기에 자바스크립트를 이미 알고 있다면 큰 어려움 없이 습득해나갈 수 있다는 점도 장점으로 작용했을 것 같네요.
타입스크립트를 소개하는 여러 영상들
https://www.youtube.com/watch?v=ZZib1YpxNdg // 드림코딩엘리 님의 타입스크립트 강의 영상
https://www.youtube.com/watch?v=lysravK7ePQ // 노마드코더의 타입스크립트 홍보(?) 영상
