타입스크립트의 동작 원리

Frontend

프로그래밍 언어의 동작 방식

컴파일

사람이 작성한 프로그래밍 언어를 컴퓨터가 이해할 수 있는 기계어로 변환하는 과정을 컴파일이라고 한다.

 

자바스크립트 컴파일 과정

자바스크립트는 다음과 같은 단계를 거쳐 컴파일 된다.

1. AST(추상 문법 트리) 변환

컴파일러는 자바스크립트 코드를 AST(Abstract Syntax Tree)로 변환한다.

AST는 코드 실행과 관계없는 요소들(공백, 주석, 탭 등)을 제거하고, 코드를 트리 형태의 자료구조로 쪼개서 저장한 형태이다.

2. 바이트 코드 변환

그 다음, AST를 컴퓨터가 실행할 수 있는 바이트 코드로 변환한다.

 

타입스크립트의 동작 과정

타입스크립트는 자바스크립트에 타입 검사 단계가 추가된 형태이다.

  1. 타입스크립트 코드를 AST로 변환
  2. AST를 분석하여 타입 검사 수행
  3. 타입 오류가 있으면 컴파일 중단
  4. 타입 검사 통과 시 자바스크립트 코드로 변환

 

타입스크립트는 결국 자바스크립트로 변환되는 것이고,

타입 관련 코드는 변환 과정에서 제거되기 때문에 프로그램 실행에 영향을 미치지 않는다.

 

즉, 타입스크립트는 자바스크립트를 더 안전하게 사용하기 위한 코드 검사 도구인 셈이다.

 

'Frontend' 카테고리의 다른 글

Zustand로 전역 상태 관리하기  (0) 2025.11.18
aria-label과 텍스트 콘텐츠  (0) 2025.11.13
웹 애플리케이션의 렌더링 방식과 Next.js  (0) 2025.11.08
타입스크립트 유틸리티 타입  (0) 2025.11.05
타입스크립트 타입 시스템: 계층과 호환성  (0) 2025.10.31
'Frontend' 카테고리의 다른 글
  • aria-label과 텍스트 콘텐츠
  • 웹 애플리케이션의 렌더링 방식과 Next.js
  • 타입스크립트 유틸리티 타입
  • 타입스크립트 타입 시스템: 계층과 호환성
고견
고견
개발 자국 남기기
  • 고견
    개발자국
    고견
  • 전체
    오늘
    어제
    • 분류 전체보기 (157) N
      • Frontend (29)
        • Next.js (16)
        • JavaScript (7)
      • CS (19) N
        • 자료구조 (9)
        • 알고리즘 (5)
        • 운영체제 (4) N
        • 네트워크 (1) N
      • TIL (93)
      • Dev Log (16)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    C
    페이지 라우터
    CS
    클래스
    useState
    Pages Router
    Spa
    cs50
    javascript
    자료구조
    react
    typescript
    generic
    인터페이스
    제네릭
    문자열
    배열
    함수 타입
    앱 라우터
    App Router
    Next.js
    ai 감성 일기장
    바닐라 자바스크립트
    타입 좁히기
    트러블 슈팅
    algorithm
    memory
    알고리즘
    Trouble Shooting
    emotion diary
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
고견
타입스크립트의 동작 원리
상단으로

티스토리툴바