icon
1장 : 타입스크립트 소개

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


지난 절에서 우리는 타입스크립트의 탄생 배경과 필요성에 대해 알아보았습니다. 이제는 타입스크립트가 기존의 자바스크립트와 구체적으로 어떤 점에서 다른지, 그리고 그 차이점이 개발자에게 어떤 의미를 가지는지 심도 있게 살펴보겠습니다. 언뜻 비슷해 보이는 두 언어 사이에 어떤 결정적인 차이가 있는지 함께 탐구해봅시다.


핵심은 '정적 타입' 시스템

자바스크립트와 타입스크립트의 가장 근본적인 차이점은 바로 타입 시스템에 있습니다.

  • 자바스크립트: 동적 타입 언어 (Dynamically Typed Language) 자바스크립트는 동적 타입 언어입니다. 이는 변수의 타입이 프로그램이 실행되는 시점(런타임) 에 결정된다는 의미입니다. 코드를 작성할 때는 변수에 특정 타입을 지정할 필요가 없으며, 같은 변수에 숫자, 문자열, 객체 등 어떤 타입의 값이라도 자유롭게 할당할 수 있습니다.

    let value = 10; // 숫자
    value = "hello"; // 문자열
    value = true; // 불리언

    이러한 유연성은 개발 초기 단계에서 빠른 프로토타이핑을 가능하게 합니다. 하지만 코드의 규모가 커지고 복잡해질수록, 예상치 못한 타입 오류로 인해 프로그램이 비정상적으로 동작할 위험이 커집니다. 개발자는 이러한 문제를 실행해보기 전까지는 알기 어렵습니다.

  • 타입스크립트: 정적 타입 언어 (Statically Typed Language) 반면 타입스크립트는 정적 타입 언어의 특성을 가집니다. 즉, 변수의 타입이 프로그램이 실행되기 전(컴파일 시점) 에 결정됩니다. 개발자가 코드를 작성할 때 변수나 함수의 매개변수, 반환 값 등에 명시적으로 타입을 지정해야 합니다.

    let value: number = 10; // 숫자
    // value = "hello"; // 오류: 'string' 형식은 'number' 형식에 할당될 수 없습니다.

    보시는 것처럼, valuenumber 타입으로 선언한 후 문자열을 할당하려 하면, 타입스크립트 컴파일러가 즉시 오류를 알려줍니다. 이는 마치 코드에 대한 강력한 안전장치와 같습니다. 개발자는 잠재적인 오류를 개발 단계에서 미리 인지하고 수정할 수 있으므로, 런타임에 발생하는 버그를 크게 줄일 수 있습니다.


컴파일 과정의 차이

두 언어의 또 다른 중요한 차이점은 컴파일 과정에 있습니다.

  • 자바스크립트: 자바스크립트 코드는 웹 브라우저나 Node.js와 같은 런타임 환경에서 직접 해석되어 실행됩니다. 별도의 컴파일 과정이 필요하지 않습니다.

  • 타입스크립트: 타입스크립트 코드는 웹 브라우저나 Node.js에서 직접 실행될 수 없습니다. 타입스크립트 컴파일러(TypeScript Compiler, tsc) 를 통해 먼저 자바스크립트 코드로 변환(Transpile) 되어야 합니다. 이 변환 과정에서 타입 검사가 이루어지고, 타입스크립트 고유의 문법(타입 선언 등)이 제거되어 순수한 자바스크립트 코드가 생성됩니다.

이러한 컴파일 과정 덕분에 타입스크립트는 자바스크립트의 모든 기능을 활용하면서도, 타입 검사라는 추가적인 안정성을 확보할 수 있게 됩니다. 최종적으로 실행되는 코드는 여전히 자바스크립트이므로, 기존 자바스크립트 생태계의 풍부한 라이브러리와 프레임워크를 그대로 사용할 수 있다는 큰 장점이 있습니다.


개발 경험의 변화

정적 타입 시스템과 컴파일 과정의 차이는 개발자의 개발 경험에 지대한 영향을 미칩니다.

  • 오류 조기 발견: 타입스크립트는 코드를 작성하는 즉시, 혹은 컴파일 시점에 타입 오류를 알려주기 때문에 런타임 오류로 인해 디버깅에 소모되는 시간을 획기적으로 줄여줍니다.
  • 강력한 도구 지원: IDE(통합 개발 환경)는 타입스크립트의 타입 정보를 활용하여 훨씬 더 정확하고 강력한 코드 자동 완성, 코드 탐색, 리팩토링 기능을 제공합니다. 이는 개발 생산성을 크게 향상시킵니다.
  • 코드의 명확성 및 협업 용이성: 타입 정보는 코드의 의도를 명확하게 드러내어 코드 가독성을 높이고, 여러 개발자가 함께 작업할 때 발생할 수 있는 소통의 오류를 줄여줍니다. 마치 코드에 상세한 사용 설명서가 붙어있는 것과 같습니다.
  • 리팩토링의 안정성: 코드를 변경할 때, 타입 시스템이 변경으로 인해 발생할 수 있는 잠재적인 오류를 미리 경고해주므로, 더욱 안심하고 대규모 리팩토링을 진행할 수 있습니다.

요약하자면, 타입스크립트는 자바스크립트의 유연성은 유지하면서도, 타입 안정성개발 생산성이라는 두 마리 토끼를 모두 잡기 위해 고안된 언어입니다. 이는 특히 규모가 크고 복잡한 애플리케이션을 개발할 때 그 진가를 발휘하며, 현대 웹 개발에서 선택이 아닌 필수가 되어가고 있습니다.


다음 절에서는 타입스크립트 개발을 위한 환경을 어떻게 설정해야 하는지 구체적으로 알아보겠습니다.