타입 추론(Type Inference), 타입 단언(Type Assertion)

이민서·2025년 1월 24일

TypeScript

목록 보기
6/7

타입 추론 (Type Inference)

TypeScript의 타입 추론은 코드를 작성할 때 명시적으로 타입을 지정하지 않아도 자동으로 타입을 추론하는 기능

  • 변수 선언시 타입 추론
let name = "John";               // string으로 추론
let age = 25;                    // number로 추론
let isActive = true;             // boolean으로 추론
let numbers = [1, 2, 3];         // number[]로 추론
let mixed = [1, "hello", true];  // (string | number | boolean)[]로 추론
  • 객체 타입 추론
let user = {
    name: "John",
    age: 25,
    addresses: {
        home: "Seoul",
        work: "Busan"
    }
}; 
// 자동으로 중첩된 객체 구조까지 타입 추론
  • 함수 반환 타입 추론
function add(a: number, b: number) {
    return a + b;  // 반환 타입이 number로 추론
}

const multiply = (a: number, b: number) => {
    return a * b;  // 반환 타입이 number로 추론
}

타입 단언 (Type Assertion)

개발자가 TypeScript보다 타입 정보를 더 잘 알고 있는 상황에서, 컴파일러에게 "이 타입이 맞으니 나를 믿어도 돼"라고 말해주는 것

  • as 문법 사용
// DOM 조작시 많이 사용
const myCanvas = document.getElementById('main_canvas') as HTMLCanvasElement;

// 객체 타입 단언
interface User {
    name: string;
    age: number;
}

const userData = getSomeData() as User;
  • 다중 타입 단언
// 두 번의 타입 단언이 필요한 경우 사용
const input = event as any as HTMLInputElement;
  • const 단언
// 일반 객체 선언
let config = {
    name: "Config",
    values: [1, 2, 3]
};  // { name: string, values: number[] }

// const 단언 사용
let configAsConst = {
    name: "Config",
    values: [1, 2, 3]
} as const;  
// { readonly name: "Config", readonly values: readonly [1, 2, 3] }

주의 사항

  • 불가능한 타입 단언
let str: string = "hello";
let num: number = str as number; // string은 number로 직접 단언할 수 없음

// 해결방법: any 또는 unknown을 중간에 사용
let num2: number = str as unknown as number; // 작동은 하지만 권장되지 않음
  • 안전한 타입 체크
// 타입 단언 대신 타입 가드 사용 권장
function processValue(value: string | number) {
    // 타입 단언 사용 (권장하지 않음)
    const strValue = value as string;

    // 타입 가드 사용 (권장)
    if (typeof value === 'string') {
        const strValue = value; // 자동으로 string 타입으로 추론
    }
}

0개의 댓글