[TypeScript] 타입 단언

🍊 타입 단언

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

특정 타입으로 정의된 변수에 빈 객체를 넣어두면 에러가 발생한다.

type Person = {
    name:string;
    age:number;
}
let person:Person = {} // ❌ 빈 객체를 넣는 경우 에러 발생

이는 person 변수 안에 들어가야할 프로퍼티가 존재하지 않기 때문이다. 

 

그렇다면 변수person을 타입을 정의하지 않고 빈 객체를 할당한 후에 나중에 프로퍼티를 초기화하는건 가능할까?

// Person타입을 선언해주지 않으면 나중에 프로퍼티를 초기화할 때 에러 발생
let person ={};
// 초기값인 빈 객체를 기준값으로 추론하기 때문
person.name = "kiji"; // ❌
person.age = 27; // ❌

 

변수 person에 빈 객체를 초기값으로 넣을경우 변수의 타입을 빈 객체를 기준값으로 추론하기 때문에 빈 객체에는 프로퍼티가 존재하지 않아 에러가 발생한다.

 

이러한 상황에  "타입 단언" 으로 변수의 타압을 단언해주면 된다.

// as 키워드를 사용해 뒤애 타입을 명시
let person = {} as Person;
person.name = "kiji";
person.age = 27;

 값 as 타입  으로 특정 값을 원하는 타입으로 단언하고 나중에 프로퍼티를 초기화한다.

 

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

type Dog = {
    name:string;
    color:string;
};

// 객체 리터럴 타입으로 선언하는 경우에는 초과 프로퍼티 발생 시 에러 발생
let dog: Dog={
    name: "만복이",
    color: "brown",
    bread: "진도" // ❌ 
}

// 타입 단언을 사용하면 초과 프로퍼티 검사를 피함
let dog={
    name: "만복이",
    color: "brown",
    bread: "진도"
} as Dog;

 

 

---

🍊 타입 단언의 규칙

1. 타입 단언의 조건

값 as 타입

위 단언식을 A as B로 표현했을 때, 두 조건 중 한가지를 반드시 만족해야한다.

• A가 B의 슈퍼타입
• A가 B의 서브타입

let num1 = 10 as never; // never 타입은 모든 타입의 서브타입
let num2 = 10 as unknown; // unknown 타입은 모든 타입의 슈퍼타입

let num3 = 10 as string; // ❌

위 두 식은 각각 뒤에 오는 타입이 슈퍼타입 또는 서브타입이기 때문에 단언이 가능하지만 number 타입과 string 타입은 서로 슈퍼-서브 타입 관계를 갖지 않으므로 단언이 불가능하다.

 

 

2. 다중 단언

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

다중 단언을 이용할 경우 불가능한 단언을 가능하도록 만들 수 있다.

let num4 = 10 as unknown as string;

단언은 왼쪽에서 오른쪽으로 이루어지기 때문에 그 순서를 살펴보면 알 수 있다.

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

unknown 타입은 모든 타입의 슈퍼타입이므로 모든 타입으로 또 다시 단언하는게 가능하다.

 

그러나 이렇게 단언하는 것은 매우 좋지 않은 방식이다.

타입 단언은 실제로 그 값을 해당 타입의 값으로 바꾸는 것이 아닌 단순 눈속임에 불과한 것이기 때문에 슈퍼-서브 관계를 갖지 않는 타입으로 단언하면 오류가 발생할 확률이 매우 높아진다.

따라서 정말 어쩔 수 없이 필요한 상황에서만 이용하는 것을 권장한다.

 

 

3. const 단언

타입 단언때에만 사용할 수 있는 const 타입이 존재한다.

특정 값을 const 타입으로 단언하면 마치 변수를 const로 선언한 것과 동일한 효과를 가진다.

let num5 = 10 as const; // num5 는 10이라는 넘버 리터럴 타입으로 단언됨

// 객체의 프로퍼티는 readonly가 됨
let cat = {
    name: "냥복이",
    color: "yellow"
} as const;
cat.name = ""; // ❌

 

 

4. Non Null 단언

어떤 값이 null 또는 undefined이 아니라는 것을 컴파일러에게 알려준다.

type Post = {
    title:string;
    author?:string; // author 프로퍼티의 값이 없을 수도 있다는 것을 의미 
}

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

// author 프로퍼티의 값의 길이 가져오기
const len: number = post.author?.length; // ❌ 
// author 뒤의 ?가 자동으로 붙음 -> ?는 옵셔널 체이닝

에러메세지를 보면 author 프로퍼티의 값에 undefined가 들어갈 수 있기 때문에 이를 number 형식에 할당할 수 없다.

 

이러한 경우 Non Null 단언을 해서 undefined가 들어오지 않는다는 것을 알려준다.

// ?대신 !를 붙여 Non Null 단언을 사용
const len1: number = post.author!.length;

 

 

---

🔗 타입스크립트 강의

한 입 크기로 잘라먹는 타입스크립트 - 인프런 | 강의