TypeScript, any와 unknown 타입 비교

any vs unknown

TypeScript에서 any와 unknown 타입은 용도가 다르기 때문에 구분해야 해야한다.

 

다음과 같이 User class가 role에 따라 Member, Store로 나뉘는 경우를 보자. Member는 일반 계정으로 주문을 넣을 수 있고, Store는 상점 계정으로 주문을 완료시킬 수 있는 메소드를 갖는다.

export abstract class User {
    id!: number;

    role!: 'member' | 'store';
}

export class Member extends User {
    constructor({ id, role}: { id: number; role: 'member' }) {
        super();
        this.id = id;
        this.role = role
    }

    placeOrder() {
        console.log('상품 주문');
    }
}

export class Store extends User {
    constructor({ id, role}: { id: number; role: 'store' }) {
        super();
        this.id = id;
        this.role = role
    }

    completeOrder() {
        console.log('주문 완료 처리');
    }
}

function main() {
    const user1: unknown = new Member({ id: 1, role: 'member'});
    const user2: unknown = new Store({ id: 2, role: 'store'});
    const user3: any = new Member({ id: 1, role: 'member' });

    if (user1 instanceof Member ) {
        user1.placeOrder();
        user1.completeOrder(); // Compile error: Property 'completeOrder' does not exist on type 'Member'.
    }

    if (user2 instanceof Store) {
        user2.placeOrder(); // Compile error: Property 'placeOrder' does not exist on type 'Store'.
        user2.completeOrder();
    }

    user3.placeOrder(); 
    user3.completeOrder(); // Runtime error; user3.completeOrder is not a function
}

main();

우선 any를 보자. user3은 any type으로 선언되었다. 보다시피, any는 모든 타입의 값이 대입가능 한데, 대입된 값을 사용할 때, 객체의 없는 속성에 접근해도 컴파일 에러가 발생하지 않는다. 마치 JavaScript를 사용하는 것과 같이 말이다. 그래서 Runtime error가 발생하게 된다.

 

user1, user2는 unknown 타입으로 선언했다. any와 달리 타입가드(type-gurad)를 해주지 않으면 Compile error가 발생해서 객체의 속성에 접근할 수 없다. 그래서 Runtime에 일어날 버그를 미리 방지할 수 있겠다.

 

결론

보통 type 추론이 어려운 경우 편리성 때문에 any를 사용하는 경우가 많다. 만약 JavaScript 코드를 TypeScript 코드로 옮기고 있거나, 다른 모듈의 type을 추론할 수 없어서 수 없어서 any를 사용하는 경우 정말 사용해도 될지 한 번 더 고민해 보는 것이 좋을 것 같다. TypeScript를 사용하는 이점 없이 JavaScript를 사용하는 것과 같기 때문이다.