이펙티브 타입스크립트 — 실무에서 바로 쓰는 핵심 팁
실무에서 바로 꺼내 쓸 수 있는 TypeScript 핵심 팁을 압축해 정리한다. satisfies 우선·as 자제·any 대신 unknown·const 단언·유틸리티 타입 활용 같은 습관과, 지금까지 걸어온 학습 여정을 한눈에 돌아본다.
지난 글에서 좋은 타입을 설계하는 원칙을 정리했다. 이제 길었던 여정을 마무리할 차례다. 기본 타입에서 출발해 좁히기, 클래스, 제네릭, 조건부·매핑 타입, 모듈과 설정, React와 빌드 도구, 그리고 실전 적용까지 — 그동안 다룬 도구는 많지만, 매일의 코드에서 효과가 가장 큰 습관은 의외로 몇 가지로 압축된다. 이번 글은 그 핵심 팁을 모으고, 지금까지의 여정을 한눈에 돌아본다.
매일 쓰는 다섯 가지 습관
배운 것이 많아도 결국 손이 기억하는 것은 자주 쓰는 패턴이다. 다음 다섯 가지는 거의 모든 TypeScript 코드에서 반복적으로 도움이 된다.
첫째, satisfies를 우선 고려한다. 타입에 맞는지 검증은 받으면서도, 추론된 좁은 타입을 그대로 유지하고 싶을 때의 정답이다.
// as 는 타입을 넓혀 좁은 정보를 잃는다
const colors = {
ok: "#55c555",
err: "#e05555",
} satisfies Record<string, string>;
colors.ok.toUpperCase(); // 여전히 string 으로 정확히 추론
둘째, as 단언은 최후의 수단이다. 단언은 컴파일러에게 “내가 맞으니 믿어라”라고 우기는 것이라, 틀리면 런타임에 조용히 터진다. 단언하기 전에 타입 가드로 좁힐 수 있는지 먼저 본다.
// ❌ 우기기
const el = document.querySelector(".btn") as HTMLButtonElement;
// ✅ 좁히기
const el = document.querySelector(".btn");
if (el instanceof HTMLButtonElement) {
el.disabled = true;
}
안전한 기본값과 리터럴 보존
셋째, any 대신 unknown을 안전한 기본값으로 쓴다. 둘 다 “아무 타입”을 받지만, unknown은 쓰기 전에 좁히기를 강제하므로 검사를 끄지 않는다. 외부 입력이나 catch의 에러처럼 타입을 확신할 수 없는 자리에 특히 잘 맞는다.
function parse(json: string): unknown {
return JSON.parse(json); // any 가 아니라 unknown 으로 받는다
}
const data = parse(input);
if (typeof data === "object" && data !== null) {
// 여기서부터 안전하게 좁혀 사용
}
넷째, const 단언으로 리터럴을 고정한다. as const를 붙이면 값이 넓은 타입으로 풀리지 않고 정확한 리터럴 타입으로 보존된다. 설정 객체나 상수 배열에서 자동완성과 정확성을 동시에 얻는다.
const ROUTES = ["home", "about", "contact"] as const;
type Route = (typeof ROUTES)[number]; // "home" | "about" | "contact"
다섯째, 유틸리티 타입으로 중복을 제거한다. 비슷한 타입을 손으로 또 적는 대신 Pick·Omit·Partial·Record 등으로 기존 타입에서 파생시킨다. 원본이 바뀌면 파생 타입도 자동으로 따라가므로 일관성이 유지된다.
interface User {
id: number;
name: string;
password: string;
}
// User 에서 파생 — 원본이 바뀌면 함께 갱신된다
type PublicUser = Omit<User, "password">;
type UserDraft = Partial<User>;
지금까지 걸어온 길
이 팁들은 모두 앞선 글 어딘가에서 깊이 다룬 도구의 응축이다. 마지막으로 우리가 지나온 길을 한 장으로 돌아보자.
설치와 기본 타입으로 시작한 기초 단계, 좁히기와 클래스로 타입의 흐름을 배운 타입 시스템 단계, 제네릭과 매핑·조건부 타입으로 타입 위에서 프로그래밍한 고급 단계, 그리고 React·빌드·마이그레이션으로 코드를 실제 제품에 적용한 실전 단계까지. 글 하나하나는 작은 주제였지만, 이어 놓고 보면 “타입으로 더 안전한 소프트웨어를 만든다”는 하나의 이야기였다.
마치며
TypeScript의 진짜 가치는 똑똑한 타입 묘기가 아니라, 우리가 코드에 대해 이미 알고 있는 사실을 컴파일러도 알게 만들어, 그 지식을 잊지 않도록 지켜 주는 데 있다. 좁은 타입, 명확한 경계, 표현 불가능한 불가능한 상태 — 이 단순한 원칙들이 쌓이면 리팩터링이 두렵지 않고, 협업이 매끄럽고, 버그가 런타임이 아니라 에디터에서 잡힌다.
긴 여정을 끝까지 함께해 주셔서 감사합니다. 여기서 배운 것들이 여러분의 코드를 조금 더 단단하게, 그리고 다루기 즐겁게 만들어 주기를 바랍니다. 이제는 직접 타입을 설계하고, 막히면 다시 이 글들을 펼쳐 보면 됩니다. TypeScript 이야기는 여기서 마칩니다. 🎉
지난 글: 타입 설계 베스트 프랙티스
읽어주셔서 감사합니다. 😊