[TypeScript] 타입스크립트의 개념

학습목표

실무에서 타입스크립트를 활용하게 되면서 기초 개념부터 학습할 필요가 있다고 느꼈습니다.

단순하게 number, string, any 등의 타입을 지정하여 사용하는 방식이라는 것은 인지하고 있었지만, 이를 사용하는 이유에 대한 고찰이 필요하다 판단하였습니다.

먼저, 타입스크립트의 기원부터 알아보도록 하겠습니다.

 

 

---

 

탄생 배경

우리는 웹을 조작하고 변경하기 위해 자바스크립트를 사용하고 있습니다.

자바스크립트를 사용하다보면 타 프로그래밍 언어보다 유연하고 편리함을 느낄 수 있는 부분이 있는데 그 중 하나는 변수를 사용할 때, 데이터 타입을 명시하지 않아도 알아서 판단할 수 있다는 특성입니다.

 

C언어와 자바스크립트의 변수 선언 방식을 예로 들어보겠습니다.

// C언어
char name = 'a';
int count = 2;

// 자바스크립트
const name = 'a';
const count = 2;

 

이와 같이 자바스크립트는 데이터 타입을 명시하지 않고 선언하고 사용해도, name과 count의 타입을 각각 콘솔에 찍어보면 string, number로 출력되는 것을 확인할 수 있습니다.

 

이러한 자바스크립트의 특성은 장점처럼 보이지만, 프로젝트의 규모가 커질수록 좋지 않은 영향을 끼칠 수 있습니다.

string 타입의 파라미터를 받아 object를 반환하는 메소드를 만들었다고 가정해보겠습니다.

실수로 number 타입의 파라미터를 보내 원하지 않는 object를 반환 받는 문제가 있을 수 있고, 만약 원하는 object를 반환 받았다 하더라도 이는 잘못된 것이지만 잘못됨을 인지하지 못하고 사용하는 결과를 초래할 수 있습니다.

 

 

이러한 경우를 들어 자바스크립트의 모호한 특성으로 인한 문제 발생 가능성을 미연에 방지하기 위한 방법이 필요하였습니다.

그렇게 2012년, 마이크로소프트 직원 Anders Hejlsberg의 주도 하에 .ts 확장자를 사용하는 타입스크립트(TypeScript)가 등장하게 되었습니다.

 

 

---

 

타입스크립트의 특징

타입스크립트를 자바스크립트와 연관하여 간략히 3가지로 요약해보도록 하겠습니다.

 

1. 타입스크립트는 자바스크립트를 기반으로 만들어진 언어이기에 자바스크립트를 자주 사용하고 있는 개발자들이 학습하기에 많은 어려움이 존재하지 않습니다.
2. 타입스크립트는 자바스크립트의 상위 호환 언어라고 할 수 있기 때문에 .ts 파일에 코드를 자바스크립트로 작성하여도 실행이 가능합니다.
3. .ts 파일을 컴파일 하면 .js 파일로 변환됩니다. (별도로 설정하지 않으면 디폴트로 es5 형식으로 변환 🛠)

 

 

다시 말해, 자바스크립트로 작성된 코드는 모두 타입스크립트 형식을 입히면 동일하게 실행 가능합니다.

(처음부터 타입스크립트 형식의 코드를 작성하기에 망설임이 있다면, 기작성된 자바스크립트 코드를 점진적으로 변경해보는 방법도 괜찮을 것 같습니다.👍)

 

다음에는 타입스크립트에서 데이터 타입을 명시하는 방법에 대해 학습해보도록 하겠습니다.

 

---

리뷰

• tsconfig.json 파일을 작성하는 방법 학습 필요
• 타입스크립트에서 데이터 타입을 명시하는 방법 학습 필요