
안녕하세요. 오늘은 JavaScript를 기반으로 만든 언어, 타입스크립트(TypeScript)에 대해 알아볼게요.
타입 스크립트(TypeScript)
타입스크립트는 자바스크립트를 기반으로 만든 언어로, Microsoft에서 개발한 오픈소스 언어예요.
JS의 모든 기능을 포함하면서도 타입 검사(정적 타입) 기능을 제공하고, 개발 중 발생할 수 있는 오류를 미리 잡을 수 있어요.
한마디로, "JavaScript에 타입(type) 기능을 추가한 언어"라고 보시면 돼요.
타입스크립트 사용목적
1. 에러 사전 방지
JS는 동적 타입 언어라 변수의 타입이 코드가 실행될 때 결정해요.
// JavaScript 예시
let name = "Tom";
name = 123; // ❌ 실행은 되지만, 의도치 않은 에러 발생 가능
반면 TS는 컴파일(빌드)할 때 타입을 검사하므로, 코드를 실행하기 전에 오류를 찾아줘요.
// TypeScript 예시
let name: string = "Tom";
name = 123; // ⚠️ 오류 발생: number는 string에 할당 불가
👉 이렇게 미리 오류를 막아주니까 안정적인 코드를 작성할 수 있습니다.
2. 코드 자동완성 및 가이드 기능
변수의 타입이 명확해서 VSCode 같은 개발 도구가 자동완성, 힌트, 오류 표시를 정확히 해줘서
개발속도와 정확성이 높아져요.
정적 타입 VS 동적 타입
| 구분 | JavaScript | TypeScript |
| 타입 결정 시점 | 실행 시점(런타임) | 컴파일 시점 |
| 유연성 | 높음 | 낮음(하지만 안전함) |
| 오류 발견 시점 | 실행 중 | 코드 작성 중 |
| 대표 특징 | 동적 타입 | 정적 타입 |
let message: string = "Hello TypeScript!";
console.log(message.toUpperCase()); // 정상 작동
// message(); // ❌ 오류: 문자열은 함수처럼 호출할 수 없음
let sayHello = () => {
console.log("Hello!");
};
sayHello(); // ✅ 함수 호출 가능
위처럼 TS는 변수 타입을 미리 지정하거나 자동으로 추론하기 때문에 의도치 않은 코드 사용을 미리 막을 수 있어요.
스코프(범위)와 모듈
TS는 파일 단위로 스코프가 자동 생성되지 않아요.
즉, 여러 파일에서 같은 이름의 변수를 쓰면 충돌할 수도 있어요.
이를 막으려면 export 키워드를 사용해 모듈로 만들면 돼요.
export const tmp = ""; // 모듈 선언
let num = 10;
console.log(num);
이렇게 하면 다른 파일의 전역 변수와 충돌하지 않아요.
TypeScript의 장단점


여기까지 TypeScript에 대해 알아봤는데요.
이 코드를 잘 활용한다면 개발효율을 높여줄 것 같아요.
'Frontend > TypeScript' 카테고리의 다른 글
| Synchronous & Asynchronous & async / await (0) | 2025.11.25 |
|---|---|
| TypeScript Generic(Advanced) (0) | 2025.11.23 |
| TypeScript Generic (0) | 2025.11.21 |
| TypeScript Interface (0) | 2025.11.21 |
| TypeScript Type (0) | 2025.11.20 |