[JS & TS] 자바스크립트와 타입스크립트의 차이

TypeScript와 JavaScript의 차이점은 단순히 타입을 지정해주는 것 이상의 기능들을 포함합니다. TypeScript는 JavaScript의 상위 집합으로, JavaScript의 기능을 모두 포함하면서도 추가적인 기능을 제공합니다. 몇 가지 주요 차이점을 설명하겠습니다.

1. 정적 타입(Type Annotations)

• TypeScript: 위 예시에서 볼 수 있듯이, TypeScript에서는 interface, type, enum 등을 사용하여 변수, 함수, 객체 등의 타입을 명시적으로 지정할 수 있습니다. 예를 들어:

interface Person {
    firstName: string;
    lastName: string;
}

function greet(person: Person) {
    console.log(`Hello, ${person.firstName} ${person.lastName}`);
}

 

 

• • 타입을 명시함으로써 코드 작성 시점에 오류를 미리 감지할 수 있습니다.
• JavaScript: JavaScript에서는 변수에 타입을 지정할 수 없고, 모든 변수는 런타임에 동적으로 타입이 결정됩니다.

function greet(person) {
    console.log(`Hello, ${person.firstName} ${person.lastName}`);
}

 

 

이는 유연하지만, 코드

 

 

2. 컴파일 시점의 오류 검사

• TypeScript: TypeScript는 코드가 JavaScript로 컴파일되기 전에 타입 오류를 검사합니다. 이로 인해 많은 잠재적인 버그를 미리 방지할 수 있습니다.
• JavaScript: JavaScript는 인터프리터 언어로, 코드를 실행할 때만 오류가 발생합니다. 즉, 오류가 발견되기 전까지 코드는 실행되지 않습니다.

 

3. 추가적인 언어 기능

• Interface와 Type: TypeScript에서는 인터페이스와 타입을 사용해 더 복잡한 구조의 타입을 정의하고 사용할 수 있습니다. 예를 들어, 객체의 구조를 미리 정의하여 강제할 수 있습니다.
• Generics: TypeScript는 제네릭을 지원하여 다양한 타입을 가질 수 있는 재사용 가능한 구성 요소를 만들 수 있습니다.

작성 시에 오류를 쉽게 감지할 수 없습니다.

 

function identity<T>(arg: T): T {
    return arg;
}

 

Enums: TypeScript는 열거형(enum)을 지원하여 숫자나 문자열의 집합에 이름을 부여할 수 있습니다.

enum Color {
    Red, Green, Blue
}

• 미리 정의된 유틸리티 타입: TypeScript는 Partial, Pick, Record 등 여러 유틸리티 타입을 제공하여 타입을 쉽게 조작할 수 있습니다.

 

4. ES6+ 기능 지원

• TypeScript: TypeScript는 최신 JavaScript(ES6+) 기능을 지원하며, ES5와 같은 구형 환경에서도 사용할 수 있도록 트랜스파일(transpile)할 수 있습니다.
• JavaScript: JavaScript의 버전은 브라우저의 지원 여부에 따라 달라집니다. 예를 들어, 최신 ES6 기능을 지원하지 않는 브라우저가 있을 수 있습니다.

 

5. 자바스크립트와 호환성

• TypeScript: TypeScript 파일(.ts)은 JavaScript 파일(.js)로 컴파일됩니다. 즉, TypeScript로 작성된 코드는 JavaScript로 변환되어 모든 JavaScript 환경에서 실행될 수 있습니다.
• JavaScript: JavaScript 코드는 TypeScript로 변환하지 않고도 TypeScript 프로젝트에서 사용할 수 있습니다.

 

요약

TypeScript는 단순히 타입을 지정하는 것뿐만 아니라, 컴파일 시점의 오류 검사, 인터페이스, 제네릭, 열거형 등 추가적인 기능을 제공하여 더 안전하고 유지보수하기 쉬운 코드를 작성할 수 있게 도와줍니다. JavaScript는 유연하지만, 런타임 오류에 대한 방지가 약하고 정적 타입 검사와 같은 기능이 없습니다. TypeScript를 사용하면 더 안정적이고 명확한 코드를 작성할 수 있게 됩니다.