본문 바로가기

🙂나의 공부 아카이브/프론트엔드 공부

[공부하면서 쓰는] Javascript와 Typescript의 차이

※  프론트엔드 개발자로 취업 준비하기 위해 쓰는 게시글입니다. 글솜씨가 부족할수 있으니 양해 부탁드려요 :) 

부족한 부분이 있으면 말씀 부탁드려요 

 

이 글에서는 자바스트립트 타입스크립트에 대해 짧게 작성하며, 마지막엔 자바스크립트와 타입스크립트의 차이를

정리할 예정입니다 

 

★ 글 순서 

Javascript 
Typescript 
자바스크립트와 타입스크립트의 차이점 

 

 

1. Javascript 

 

정의 : 자바스크립트는 웹페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어입니다.

(출처: 모던 자바스크립트)

 

변수 -   데이터를 저장하는 공간으로  var, let, const를 사용하여 선언. 

 

* var, let, const의 차이 

 

var :  ES5에서 변수를 선언할 수 있는 방법으로 재선언, 재할당이 가능

var name = "julia";
var name = "selly";

 

let :  동일한 변수명으로 재선언이 불가능 (이미 선언된 변수에 대한 재선언을 허락하지 않는다)  중복선언 x  재할당 o 

let a = 5;
let b = 6;

 

const : 상수로 변하지 않는 값을 뜻하며 값을 바꿀수 없고 재선언이 불가능하다 (재할당 재선언 불가능)

const num = 10;

 

2.typescript 

 

자바스크립트의 모든 기능을 포함하는 상위 집합의 언어 (정적타입)

챗gpt에서 정의한 타입스크립트의 의미 : 자바스크립트의 상위 집합(Superset)으로, 자바스크립트에 정적 타입 검사 기능을 추가한 프로그래밍 언어입니다. 

 

특징 

정적 타입 검사가 가능한데  코드를 쓸 때 오류를 미리 알려주어 사전에 오류를 미리 예방할수 있음 
인터페이스 : 객체의 구조를 정의하여 명확한 데이터 구조를 설계할 수 있음 
타입을 매개변수로 사용해 유연하고 재사용 가능한 코드로 작성이 가능함 
모듈 시스템: 코드를 파일 단위로 분리하여 관리하고 재사용 가능.

 

 

3. 자바스크립트와 타입스크립트의 차이 

 

특징 Javascirpt Typescript
타입 시스템 동적타입 정적타입
컴파일 필요X 자바스크립트로 컴파일이 필요함
개발 경험 유연하고 빠르게 시작할수 있음 코드완성,타입 검사로 향상된 개발 경험
프로젝트 규모 작은 프로젝트에 적합함 큰 대형 프로젝트에 적합함
런타임 오류 런타임에 타입 오류 발견 가능 컴파일 타임에 타입 오류 발견가능 
학습 곡선 낮음 높음
도구 지원 광범위한 도구와 라이브러리 지원 자바스크립트 생태계의 모든 도구와 라이브러리를 지원함 
브라우저 모든 브라우저에 기본적으로 지원함 트렌스파일된 자바스크립트가 모든 브라우저에서 지원함 

 

 

4. 마무리 (결과)

 

물론 타입스크립트는 진입 장벽이 높고 공부해야 할 것이 많지만 코드를 작성할 때 오류를 잡아주어 런타임때의 

오류를 현저하게 줄여주는 장점이 있어 타입스크립트의 활용성이 앞으로도 높다고 생각된다.