TypeScript vs ECMAScript

ECMAScript (ES):

ECMAScript는 JavaScript 언어의 표준 사양입니다.
ECMAScript는 JavaScript의 기본 구조와 규칙을 설정하며, JavaScript 엔진이 이 표준을 따라 구현되어야 합니다.
ECMA International이라는 표준화 기구가 관리하며, 시간이 지남에 따라 여러 버전의 ECMAScript 사양이 발표되었습니다 (예: ES3, ES5, ES6/ES2015 등).


TypeScript

TypeScript는 Microsoft에서 개발한 JavaScript의 상위 집합(superset) 언어입니다.
TypeScript는 JavaScript의 모든 기능을 포함하며, 그 위에 정적 타입 체크와 인터페이스, 제네릭, 데코레이터 등과 같은 추가 기능을 제공합니다.
정적 타입 체크는 코드의 오류를 런타임 전에 찾아내고, 코드의 가독성과 유지 관리성을 향상시킵니다.
TypeScript는 개발 시간에 TypeScript 코드를 JavaScript 코드로 변환(트랜스파일)하여 실행할 수 있도록 합니다. 이는 TypeScript 컴파일러를 사용하여 수행됩니다.


비교:

타입 시스템: TypeScript는 정적 타입 시스템을 제공하는 반면, ECMAScript(JavaScript)는 동적 타입 시스템을 사용합니다.
추가 기능: TypeScript는 ECMAScript의 기능에 추가적인 기능을 제공하여, 큰 프로젝트의 관리와 유지 보수를 돕습니다.
호환성: TypeScript는 JavaScript와 완벽하게 호환되며, TypeScript 코드는 JavaScript 코드로 변환될 수 있습니다.
표준화: ECMAScript는 국제 표준이며, TypeScript는 Microsoft에 의해 관리되는 오픈 소스 프로젝트입니다.

 

코드 샘플

// javascript
function add(a, b) {
    return a + b;
}

const result = add(5, '10');  // Output: '510' (문자열 연결)


//typescript
function add(a: number, b: number): number {
    return a + b;
}

const result = add(5, '10');  // Type Error: Argument of type 'string' is not assignable to parameter of type 'number'.

위의 TypeScript 코드에서 add 함수는 두 개의 숫자 타입 매개변수를 받아야 하며, 숫자 타입의 값을 반환해야 한다는 것을 명시적으로 지정합니다. 따라서, 문자열을 매개변수로 전달하려고 하면 컴파일 타임에 타입 에러가 발생합니다.

이 예제는 TypeScript의 정적 타이핑이 코드의 안정성을 어떻게 향상시키는지 보여줍니다. TypeScript는 개발자에게 잠재적인 문제를 미리 알려주어, 런타임 에러를 줄이고 코드의 품질을 향상시킵니다.

 

반응형

'Programming > frontend' 카테고리의 다른 글

local storage/session storage  (0) 2023.10.07

+ Recent posts