안녕하세요, Derek 입니다. :)

최근에 저는 typescript 를 스리슬쩍 들여다 보고 있는데요,

inflearn 에 있는 captain pangyo님의 강의를 수강하기 시작했습니다 :)

강의를 들으며 새롭게 알게 된 내용을 중심으로 업로드 해보겠습니다.

이 글은 전적으로 캡틴 판교님의 글에 기반하고 있습니다.

1. typescript 란?

typescript , 이 친구는 도대체 뭐하는 친구인가.

여러 사이트에서 말하는 바는 이와 같습니다.

TypeScript 는 Microsoft에서 개발 및 유지 관리 하며 오픈 소스 프로그래밍 언어이다.

JavaScript 의 모든 구문과 의미를 지원 하는 동시에 정적 유형 지정 및 ECMAScript 의 상위 집합 인 더 풍부한 구문과 같은 몇 가지 추가 기능 어쩌구 저쩌구..

복잡시렵다. 본론충은 본론만을 원해요.

고로, 본론은,

javascript + type 인 언어이다.

즉, 타입을 겁나게 중요하게 취급하는 javascript 라고 보면 되겠다.

오호라, 그거 참 괜찮네! 생각이 들었다. C++ 이 익숙한 나로선, 변수 선언 var 는 최악일세.. 생각을 했고, 그나마 let 이나 const 를 써서 그래.. 이 정도면 나쁘지 않다.. 생각을 했다.

2. typescript 를 왜 쓰는가?

근데 그럼, 왜? typescript 를 쓰는거지?

그렇지 않아도 javascript 언어로도 녹록치 않은데, 이 친구를 요구하는 기업이 점점 많아지는 이유가 무엇인가? 개 귀찮게.

쓰는 이유는, 다음과 같이 2가지 이유가 있다고 한다.

1) 에러의 사전방지

기존 javascript 는 매우 놀랍게도 다음과 같은 코드가 실행이 됩니다

function sum(a, b) {
  return a + b;
}

sum(10, 20); // 30
sum('10', '20'); // 1020

숫자를 더하려고 만든 함수 sum 은 인자로 숫자가 오든 문자가 오든 상관하지 않습니다. 개 쎈 친구거든요.

심지어 아래와 같은 구문도 가능합니다.

function sum(a, b) {
  return a + b;
}
sum(10, "설마 이게 되겠냐") // "10설마 이게 되겠냐"

놀랍습니다. 숫자와 문자를 더해서 concat 을 한것 처럼 문자열로 더합니다.

물론 유연하다고 생각하여 좋다고 느낄 순 있지만, 이는 원하지 않는 상황을 야기할 수 있습니다.

그래서 미리 정해주는 거에요. 이 함수는 숫자와 숫자를 더하는 함수야! 라구요.

미리 보여드리자면, 다음과 같이 타입을 정해서 작성 가능하다.

function sum(a: number, b: number) {
  return a + b;
}

인자로 들어가는 a 와 b 에 타입을 number 로 정해주는 모습이네요.

2) 코드 자동 완성과 가이드

이는 visual studio code 를 사용할 때의 장점을 기술합니다.

타입을 선언한 변수에 한해서, 지원되는 API 들이 하단에 볼 수 있습니다.

가령, typescript 을 사용해 string 으로 선언한 변수는 아래와 같이 string api 를 확인 할 수 있다.

이와 달리 javascript 는 해당 기능이 지원되진 않습니다.

간단하게 typescript 가 뭔지, 이를 왜 쓰는지에 대해서 정리를 해보았습니다.

다음 게시물 부터는 문법 관련해서 내용을 본격적으로 포스팅해보겠습니다.

틀린내용이나 수정할 내용있으면 언제든지 댓글 부탁드려요 :)

감사합니다. 🙂