[TS] 타입 단언

TIL

타입 단언이란

값 as 타입을 이용하면 특정 값을 원하는 타입으로 단언할 수 있다.

type Person = {
  name: string;
  age: number;
};

let person: Person = {};
person.name = "woodstock";
person.age = 345;

위와 같이 변수 person은 Person 타입으로 정의되었지만 초기화 할 때에는 빈 객체를 넣어두고 싶다고 가정할 경우, 타입스크립트는 이를 허용하지 않는다.

Person 타입은 name과 age 프로퍼티를 필수로 요구하지만, 빈 객체 {}에는 이 속성들이 없기 때문에 타입 오류가 발생하는 것이다.

 

이럴 땐 다음과 같이 빈 객체를 Person 타입이라고 단언해주면 된다.

이제 타입스크립트는 빈 객체를 Person 타입으로 인식하고, 이후 person.name과 person.age에 값을 할당할 수 있다.

 

타입 단언은 다음과 같이 초과 프로퍼티 검사를 피할 때에도 사용할 수 있다.


위 코드에서는 breed라는 초과 프로퍼티가 존재하지만 이 값을 Dog타입으로 단언하여 초과 프로퍼티 검사를 피했다.

 

타입 단언의 조건

값 as 타입 형식의 단언식을 A as B로 표현했을 때 아래의 두 가지 조건 중 한 가지를 반드시 만족해야 한다.

  • A가 B의 슈퍼타입이다.
  • A가 B의 서브타입이다.
let num1 = 10 as never; // ✅
let num2 = 10 as unknown; // ✅
let num3 = 10 as string; // ❌

 

첫 번째 경우, 10은 number 타입이고 never는 모든 타입의 서브타입이므로 단언이 가능하다.

두 번째 경우, 10은 number 타입이고 unknown은 모든 타입의 슈퍼타입이므로 단언이 가능하다.
세 번째 경우, number와 string은 서로 슈퍼-서브 관계가 아니므로 직접 단언할 수 없다.

 

다중 단언

타입 단언은 다중으로도 가능하다.

let num3 = 10 as unknown as string;

다중 단언의 경우 왼쪽에서 오른쪽으로 단언이 이루어진다. 순서대로 살펴보면 다음과 같다.

  1. number 타입의 값을 unknown 타입으로 단언한다.
  2. unknown 타입의 값을 string 타입으로 단언한다.

이렇게 중간에 값을 unknown 타입으로 단언하면 unknown 타입은 모든 타입의 슈퍼타입이기 때문에 모든 타입으로 또 다시 단언하는 게 가능하다.

 

그러나, 타입 단언은 실제로 그 값을 해당 타입의 값으로 바꾸는 것이 아니라 단순 눈속임에 불과하기 때문에 위와 같은 방법을 사용하면 오류가 발생할 확률이 매우 높아 권장하지 않는다.

 

const 단언

as const를 사용하면 변수의 타입이 가장 구체적인 리터럴 타입으로 추론된다.

let num4 = 10 as const;

number 타입이었던 num4가 10 Number Literal 타입으로 단언된다.

 

객체의 경우에는 모든 프로퍼티가 readonly를 갖도록 단언된다.

let cat = {
  name: "야옹이",
  color: "yellow",
} as const;

 

Non Null 단언

Non Null 단언은 값 as 타입 형태를 따르지 않는 단언으로, 값 뒤에 !를 붙여주면 이 값이 undefined이거나 null이 아닐 것으로 단언할 수 있다.

type Post = {
  title: string;
  author?: string;
}

let post: Post = {
  title: "게시글1",
  author: "woodstock"
}

const len: number = post.author!.length;

'TIL' 카테고리의 다른 글

[TS] 서로소 유니온 타입  (0) 2025.11.01
[TS] 타입 좁히기  (0) 2025.10.31
웹페이지를 조작하는 DOM  (0) 2025.10.31
spread와 rest  (0) 2025.10.31
구조 분해 할당  (0) 2025.10.31
'TIL' 카테고리의 다른 글
  • [TS] 서로소 유니온 타입
  • [TS] 타입 좁히기
  • 웹페이지를 조작하는 DOM
  • spread와 rest
고견
고견
개발 자국 남기기
  • 고견
    개발자국
    고견
  • 전체
    오늘
    어제
    • 분류 전체보기 (157) N
      • Frontend (29)
        • Next.js (16)
        • JavaScript (7)
      • CS (19) N
        • 자료구조 (9)
        • 알고리즘 (5)
        • 운영체제 (4) N
        • 네트워크 (1) N
      • TIL (93)
      • Dev Log (16)
  • 블로그 메뉴

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

  • 공지사항

  • 인기 글

  • 태그

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

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
고견
[TS] 타입 단언
상단으로

티스토리툴바