개발하는데 다 이유가 있겠지

function add (num1, num2) {
	console.log(num1 + num2);
}

add();	// NaN
add(1);	// NaN
add(1,2);	// 3
add(3,4,5);	// 7
add('hello','world');	// 'helloworld'

function showItems(arr) {
	arr.forEach((item) => {
    	console.log(item);
    });
}

showItems([arr]);
showItems(1,2,3);	// TypeError: arr.forEach is not a function

위와 같이 자바스크립트는 우리가 원하는 결과가 아님에도 어떠한 경고도 주지 않았고 실수가 분명한 코드임에도 에러를 일으키지 않는다.

💡 자바스크립트는 동적언어이다.
→ 런타임(코드가 실행되는 시점)에 타입이 결정되고 오류를 발견할 수 있다.

💡 타입스크립트는 정적언어이다.
→ 컴파일 시점에 타입이 결정되어 오류를 발견할 수 있다.

 

타입스크립트

---

타입스크립트는 JavaScript 기반의 정적 타입 문법을 추가한 프로그래밍 언어이다.

JavaScript 엔진을 사용하며 자신이 원하는 변수의 타입읠 정의하고 프로그래밍을 하면 JavaScript로 컴파일되어 실행된다.

TypeScript는 정적 타입 기반(컴파일을 하는 과정) 언어이다.

알맞지 않은 자료형이 들어가면 컴파일 에러를 발생시켜 컴파일 과정에서 에러 처리를 할 수 있고, 손쉬운 디버깅이 가능해진다.

 

동적 타입 언어(JS) / 정적 타입 언어(TS)

---

자바스크립트(JS) - 동적 타입

→ 인터프리터 언어 : 소스 코드를 한 줄 한 줄 읽어가며 명령을 바로 처리하는 언어로 코드가 즉시 실행되기 때문에 컴파일 언어에 비해 빠르다.

 

타입스크립트(TS) - 정적 타입

→ 컴파일 언어 : 소스 코드 전체를 컴퓨터가 이해할 수 있는 기계어로 변환하는 언어로 변환과 실행이 따로 이루어진다. 소스 코드를 기계어로 변환하는 과정에서 인터프리터 언어보다 시간이 오래 걸리지만 런타임 상황에서는 모든 소스 코드가 변환되어 있기에 빠르게 실행할 수 있다.

 

유연성 / 결합성

---

자바스크립트는 타입을 지정하지 않기 때문에, 자료형을 바꿔가며 사용하는 것이 가능해 유연성이 좋다.

// JavaScript
var a = "string"
var b = 2
a = 1 // 자료형이 number가 됐다.

var c = a + b	// 3

타입스크립트는 한 번 타입을 지정하면 자료형을 변경할 수 없다.

하지만 타입을 지정함으로써 IDE와 결합성이 좋다.

Ctrl + Click을 통해 class와 function을 쉽게 역추적할 수 있어 추적에 필요한 시간을 줄일 수 있다.

JavaScript	TypeScript
동적 타입 언어	정적 타입 언어
인터프리터 언어	컴파일 언어
독립적으로 사용 가능	자바스크립트에 의존적임 (자바스크립트로 컴파일된 후 실행)
유연성	IDE와의 결합성
작고 간단한 프로젝트에 적합	복잡한 프로젝트에 적합

 

Reference
JavaScript vs TypeScript 대체 차이가 뭔데?