Moong's Project
[Javascript vs Typescript ] Javascript와 Typescript의 개념 및 차이점 본문
[Javascript vs Typescript ] Javascript와 Typescript의 개념 및 차이점
Dev.Moong 2023. 3. 8. 13:52
오늘의 포스팅 내용은 JavaScript(자바스트립트)와 TypeScript(타입스크립트)의 개념과 차이점에 대해서 작성해 보겠습니다.
1. JavaScript
일단 자바스크립트에 대해 알아보도록 하겠습니다.😊
자바스크립트란?
자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어입니다.
HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있습니다.
자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다.
자바스크립트의 특징
1. JavaScript는 객체 기반의 언어입니다. 하지만 상속과 클래스라는 개념은 없습니다.
2. JavaScript는 인터프리터 언어로서 클라이언트의 웹 브라우저에 의해 해석되고 실행됩니다.
3. JavaScript는 HTML문서 내에 기술되고 HTML 문서와 함께 수행됩니다.
4. JavaScript는 HTML에 연산 제어 등 프로그래밍적인 요소를 추가하고 클라이언트의 자원을 활용할 수 있게 합니다.
2. TypeScript
다음은 타입스크립트에 대해 알아보도록 하겠습니다.😊
타입스크립트란?
타입스크립트(TypeScript)는 자바스크립트에 타입을 부여한 언어로 자바스크립트의 확장된 언어입니다.
기존 자바스크립트 내에서 var로 동적 타입이 이루어지던 것에 대해, 타입스크립트에서는 자료형(string, number, object)에 대해서 정적 타입을 사용합니다.
마이크로소프트(MS)에서 개발한 오픈소스 프로그래밍 언어이며, 자바스크립트(JavaScript)의 단점을 보완하기 위해 만들어졌습니다.
요즘 대부분의 프로젝트에도 많이 사용하고 있는 언어이며, 실제로 2022년 4분기 인기 Top10에서 5위에 랭크될 정도로 인기가 많은 언어입니다.
타입스크립트의 특징
1. 타입스크립트는 정적 타입의 컴파일 언어이며 타입스크립트 컴파일러 또는 바벨(Babel)을 통해 자바스크립트 코드로 변환됩니다.
2. 코드 작성 단계에서 타입을 체크해 오류를 확인할 수 있고 미리 타입을 결정하기 때문에 실행 속도가 매우 빠르다는 장점이 있습니다.
3. 아래 사진과 같이 자료형(string, number, object) 정적 타입을 사용합니다.
4. 타입스크립트는 ES6에서 새롭게 사용된 문법을 포함하고 있으며 클래스, 인터페이스, 상속, 모듈 등과 같은 객체 지향 프로그래밍 패턴을 제공합니다.
3. JavaScript 과 TypeSctipt의 차이점
자바스크립트와 타입스크립트의 가장 핵심적인 차이는 타입이 있느냐 없느냐의 차이입니다.
| JavaScript | TypeScript |
| JavaScript는 웹 페이지에 상호 작용을 추가하는 인터프리터 기반 언어입니다. | TypeScript는 일반 JavaScript로 컴파일되는 Javascript의 상위 집합입니다. |
| 언어 범주 | |
| Javascript는 스크립팅 언어입니다. | TypeScript는 객체 지향 프로그래밍 언어입니다. |
| 편집 | |
| Javascript에는 컴파일러가 필요하지 않습니다. 웹 브라우저에서 실행됩니다. | TypeScript는 JavaScript 파일로 변환하기 위해 TypeScript 컴파일러가 필요합니다. |
| 객체 지향 기능 | |
| JavaScript는 순수하게 객체 지향적이지 않습니다. 프로토 타입 기반입니다. 인터페이스가 없습니다. | TypeScript는 객체 지향 프로그래밍 언어이며 클래스 기반입니다. 클래스, 상속, 인터페이스 및 수정자를 사용할 수 있습니다. |
| 실행 방법 | |
| JavaScript는 클라이언트 측에서 실행됩니다. | TypeScript는 클라이언트 측과 서버 측에서 실행됩니다. |
| 정적 검사 | |
| Javascript에는 정적 유형 검사가 없습니다. | TypeScript에는 정적 유형 검사가 있습니다. |
| 모듈성 | |
| Javascript는 지원 모듈을 허용하지 않습니다. | Typescript는 파일과 모듈을 가져올 수 있습니다. |