[TIL] TypeScript 언어의 탄생 배경 기본적인 특징

 

1. TypeScript의 탄생 배경

1) JavaScript와 Node.js

• 원래 JavaScript는 HTML, CSS와 함께 사용되어 웹 페이지에서 동적인 효과를 주기 위해 만들어진 스크립트 언어
• 시간이 지나면서 자바스크립트의 성능을 높이고자 하는 니즈 발생
  • 구글 V8 엔진의 탄생 → Chrome 브라우저에 내장되어 있음
  • 구글 V8 엔진의 우수한 성능을 기반으로 Node.js라는 플랫폼이 탄생하고, 이를 통해 JS 언어로도 백엔드 프로그래밍이 가능해짐

 

2) Node.js의 잠재적 위험성

• 프론트엔드에서의 에러는 사용자가 보는 뷰를 해칠 수는 있어도, 웹 페이지를 이용하는데 전반적인 동작에 피해를 끼치는 경우는 많지 않다
• 하지만 백엔드에서의 에러의 경우, 에러에 대한 예외 처리가 제대로 되지 않으면 단순한 에러 하나로 인해 서버가 다운될 수도 있음
• 그런데, 다른 언어의 경우에도 단순한 에러 하나 때문에 서버가 다운될 수 있는 것은 마찬가지 아닐까? 왜 JS 기반의 Node.js에 대해서 유독 이런 이야기를 더 하는 것일까?
  → JS가 동적 타입 언어이기 때문

정적 타입 언어 : 컴파일시 변수 타입이 결정되는 언어
동적 타입 언어 : 런타임시 변수 타입이 결정되는 언어

 

3) JavaScript 언어의 약점

(1) 런타임에 결정되는 변수 타입

• JavaScript는 변수 타입이 실행 시간에 결정됨 (변수에 들어오는 데이터들이 너무 다양해서)
• 이로 인해 개발자의 실수로 인한 오류가 발생하기도 쉽고, 이 오류를 찾기도 까다로움
• 예) 변수에 잘못된 타입의 값이 할당되어 발생한 오류를 찾기 위해서는 실행 시간에 변수의 값과 타입을 모두 확인해야 하는 번거로움이 발생

 

(2) 타입체크가 약하다

• JS는 let, const와 같이 변수, 상수를 구분하는 정도의 키워드만 지원이 됨
• 예) let a = 1, a = “Hello”;가 얼마든지 가능한 것이고 이렇게 되면 약간의 실수로도 예상치 않은 동작이 발생할 수도 있음 → a가 숫자인 줄 알았는데 갑자기 문자열이 되어있다고?

 

(3) 외부로부터 취약한 객체

• 잘못된 코드의 예

const obj = { latitude: 11.5, longitude: 47.1 }
const result = obj.latitude * obj.lngitute
	// 변수명 스펠링 에러 - 보통 이러한 실수는 컴파일러가 잡아주어야 함
console.log(result) // NaN이라는 엉뚱한 값이 출현!

• 객체 타입은 캐릭터가 확실해야 함 → 객체 지향 프로그래밍
• JS에서는 개발자가 쉽게 객체의 성질을 수시로 변화시킬 수 있으므로 에러 발생 확률 ↑

 

 

 

---

2. TypeScript 소개

1) 탄생 배경

• MS에서 개발한 오픈소스 프로그래밍 언어
• JS의 단점을 상쇄하기 위해 만들어짐

 

2) TS가 JS의 단점을 극복한 방법

(1) 단점 1 : 런타임에 결정되는 변수 타입

TypeScript에서는? 런타임이 아닌 컴파일 때 변수 타입을 체크

• 함수 시그니처 : 함수명, 함수 매개변수의 이름, 매개변수의 타입, 리턴 데이터의 타입
• Vs Code에서도 에러 메시지가 발생되고, 컴파일 타임에도 에러가 발생되기 때문에 쓸데없는 에러 걱정을 하지 않아도 됨!

 

(2) 단점 2 : 약한 타입체크

TypeScript에서는? 런타임이 아닌 코드 편집기(VS Code 등)에서 코드를 입력하는 순간에 에러 메시지 발생

 

(3) 단점 3 : 외부로부터 취약한 객체

TypeScript에서는? 런타임이 아닌 코드 편집기(VS Code 등)에서 코드를 입력하는 순간에 에러 메시지 발생

• 정의되지 않은 프로퍼티를 연산하여 NaN을 반환하는 현상을 미리 방지할 수 있음

 

3) TypeScript의 특징

타입스크립트는 자바스크립트의 모든 기능을 포함하면서, 추가적인 기능을 제공한다

• 객체 지향 프로그래밍의 특징을 가짐 : 캡슐화(접근 제한자), 추상화, 상속, interface, getter와 setter 등

 

 

 

---

3. 컴파일러