타입스크립트란?
TypeScript는 JavaScript를 확장하여 만든 오픈 소스 프로그래밍 언어로 2012년경 Microsoft에서 개발했습니다. 2017년 2월에 출시되어 구글의 기본 개발 언어로 승인된 2.2 이후 2개월마다 새 버전이 출시됩니다. TypeScript를 개발하는 이유는 JavaScript를 사용하여 대규모 애플리케이션을 개발할 때 복잡한 JavaScript 코드를 처리하기 위한 구성 요소 군대를 쉽게 개발할 수 있는 전용 도구가 필요하기 때문입니다. 당시 자바스크립트의 단점을 보완하고 사용의 불편함을 개선해 대규모 개발이 버그를 만나기 어려운 언어로 구상됐다. TypeScript도 Google에서 개발한 프레임워크에 도입되어 유망한 언어 중 하나라고 할 수 있습니다.
TypeScript 기능
TypeScript는 JavaScript의 엄격한 상위 집합(상위 호환)입니다. JavaScript와 달리 정적 변환이 가능하여 대규모 개발에 사용하기 편리합니다. 게다가 JavaScript는 ES2015(ES6) 이전에는 클래스 개념이 없었기 때문에 당시에는 클래스를 사용할 수 있는 기능이 있었지만 지금은 JavaScript도 클래스를 사용할 수 있으므로 이 점은 TypeScript만의 고유한 점이라고 할 수 없습니다.
TypeScript는 JavaScript와 매우 호환됩니다.
TypeScript는 다른 AltJS와 마찬가지로 컴파일 시간에 작성된 코드를 JavaScript 코드로 변환하여 라이브러리 권한을 포함하여 JavaScript와 100% 호환됩니다. TypeScript에서 확장된 함수는 컴파일러에 의해 JavaScript 코드로 변환됩니다. 현재 JavaScript로 작성된 모든 프로그램은 TypeScript 프로그램으로 실행할 수 있습니다.
TypeScript는 템플릿을 정의할 수 있습니다.
TypeScript는 변수의 유형을 정의할 수 있는 JavaScript의 확장입니다. 프레임을 정의할 수 있으므로 변수에 정의된 프레임과 값에 할당된 프레임이 다른 경우 컴파일 타임 오류가 발생하므로 디버깅에 유용합니다. 또한 변수 선언 시 값을 전달함으로써 타입을 지정하지 않고 자동으로 타입을 선언한 것처럼 동작하는 ‘타입 유추’가 가능하다. 제네릭을 JavaScript와 다른 기능으로 사용할 수도 있습니다. 제네릭은 템플릿을 추상화하여 실제로 사용할 때까지 템플릿이 최종이 아닌 클래스 또는 함수를 다루는 유형의 인수를 나타내며 동일한 기능을 가진 여러 함수를 하나로 그룹화하여 코드 중복을 줄입니다.
TypeScript와 JavaScript의 차이점
TypeScript를 사용하면 JavaScript와 동일한 구문 또는 라이브러리를 사용할 수 있습니다. TypeScript와 JavaScript의 차이점은 형식의 차이입니다. JavaScript는 런타임에 데이터 유형을 결정하는 동적 유형인 반면 TypeScript는 유형을 미리 정의하는 정적 유형입니다. 자바스크립트는 동적 타입이기 때문에 실행까지 오류 유무를 감지하기 어렵고 오류가 발생하기 쉽습니다. 따라서 TypeScript는 정적 속성을 가정하도록 설계되었으므로 컴파일 타임 오류의 존재를 쉽게 알아차릴 수 있습니다. JavaScript로 개발할 때 많은 엔지니어가 직면하는 “Uncaught TypeError: Cannot read property ** of undefined”를 방지하기 위해 컴파일러 옵션에서 null 또는 undefined 가능성이 있는 변수를 확인할 수 있습니다. 이런 식으로 언어 자체는 실수를 피하고 실수를 쉽게 찾을 수 있도록 설계되었습니다. 또한 TypeScript의 코드는 JavaScript보다 간단하고 가독성이 좋으며 Microsoft Visual Studio와 같은 통합 개발 환경을 사용하는 경우 개발 효율성을 크게 향상시키는 강력한 입력 완성 기능을 사용할 수 있습니다. JavaScript에 비해 간결한 코드와 개발 환경 지원으로 인해 여러 엔지니어가 참여하는 대규모 개발에 적합합니다.
타입스크립트의 장점
JavaScript 개발을 간소화하고 기능을 확장하는 AltJS 외에도 TypeScript에는 특히 개발용으로 TypeScript를 채택할 때 여러 가지 이점이 있습니다.
JavaScript와의 높은 호환성
TypeScript는 JavaScript의 엄격한 상위 집합(상위 호환)이 됩니다. 따라서 JavaScript 개발 환경이나 실행 환경이 있으면 TypeScript를 바로 사용할 수 있습니다. 또한 TypeScript에서 JavaScript로 작성된 파일을 호출하거나 TypeScript에서 JavaScript용으로 개발된 라이브러리 또는 프레임워크를 사용할 수 있습니다.
실수는 피할 수 있다
TypeScript는 선택적 정적 특성 언어이므로 코드에서 변수 특성을 선언할 수 있습니다. 프레임과 값이 다르면 컴파일 오류가 되므로 프로그램 전체에서 오류를 방지할 수 있습니다. 또한 JavaScript는 실행 시 오류가 발생하는 undefined 가 발생하기 쉽습니다. TypeScript를 사용하면 컴파일러 옵션을 사용하여 null이거나 정의되지 않은 변수를 확인하여 코드 문제를 쉽게 찾고 수정할 수 있습니다.
자바스크립트를 알면 기억하기 쉬움
TypeScript는 JavaScript를 기반으로 기능을 확장합니다. 이 때문에 자바스크립트와 공학적 법칙은 밀접한 관계가 있어 자바스크립트를 배우는 사람들에게 타입스크립트는 기억하기 쉬운 언어라고 할 수 있다. 또한 JavaScript 라이브러리 또는 프레임워크를 사용하는 경우 JavaScript에 대한 지식이 필요할 수 있습니다. TypeScript를 배우고 능숙하게 사용하려면 JavaScript에 대한 지식이 있어야 원활하게 진행할 수 있습니다.
TypeScript와 JavaScript 프레임워크 간의 관계
JavaScript용 프레임워크는 TypeScript에서도 사용할 수 있습니다. 프레임워크는 추가적인 복잡한 기능의 구현을 용이하게 하고 애플리케이션 개발의 효율성을 향상시킵니다. 각각 고유한 속성 집합이 있는 JavaScript용 프레임워크가 여러 개 있습니다. TypeScript와의 관계는 다릅니다. 아래에 소개된 프레임워크 중 일부는 모두 오픈 소스이며 GitHub에 공개적으로 사용 가능한 리포지토리가 있습니다.
AngularJS
Google 및 기타 여러 회사 및 개인을 포함하는 커뮤니티에서 개발한 프런트 엔드 웹 애플리케이션 프레임워크입니다. 단일 페이지 애플리케이션 개발이 가능하고 모든 기능을 하나의 프레임워크 내에서 완성하는 풀스택 프레임워크라는 특징이 있습니다. JavaScript용 프레임워크로 개발되었지만 버전 2.0부터는 TypeScript로 개발하는 것을 권장합니다.
반응하다
Facebook 커뮤니티에서 개발한 사용자 인터페이스 구축에 적합한 프레임워크입니다. 단일 페이지 애플리케이션 또는 모바일 애플리케이션의 개발 기반으로 사용할 수 있습니다. API 라우팅 및 통신을 위해 추가 라이브러리를 사용합니다. JavaScript 개발은 JavaScript에 권장되는 프레임워크이지만 TypeScript를 확장과 함께 사용할 수도 있습니다.
Vue.js
Google에서 Angular JS 개발을 도왔던 Mr. Evan You가 개발한 고급 프레임워크입니다. 단순성, 높은 자유도, 가볍고 빠른 동작이 특징이며 웹 UI 개발에 필요한 부분만 취하여 다른 라이브러리와 자유롭게 결합할 수 있습니다. 코어 라이브러리와 지원 라이브러리 또는 패키지를 공유하기 때문에 부분적으로 필요할 때 컴팩트하게 도입할 수 있다는 장점이 있다. Vue3.0은 TypeScript로 설명되며 확장 기능을 사용하지 않고 TypeScript로 개발할 수 있습니다.