typescript any 와 unknown의 차이

😀 unknown은..

TypeScript 3.0 버전부터 추가된 타입입니다.

unkwon은 any와 마찬가지로 모든 타입에 값이 할당될 수 있는

마치 any와 비슷하게 동작하는 타입입니다.

 

그렇다면 왜 unknown 타입이 필요한 걸까요?

그냥 any로 사용하면 되지 않을까요?

typescriptlang.org의 설명에 따르면 any와 unknown의 차이점은 다음과 같습니다.

초록 체크표시는 tsconfig.ts의 strictNullChecks 옵션이 꺼져있을 때만 호환된다는 의미입니다.

 

any와의 눈에띄는 차이점은

unknown 타입은 any 타입 외의 어떤 타입에도 할당할 수 없다는 것입니다.

반면 any는 never를 제외한 모든것에 할당 가능합니다.

 

이것은 무슨 의미일까요?

예제를 통해 확인해보면 더욱 명확해집니다.

let varr:unknown
let booleanType:boolean = varr 
// error boolean 타입에는 unknown 타입을 할당할 수 없어요

let bool:boolean = true
let unkw:unknown = bool
// 반대로 unknown 타입에 boolean 타입을 할당하는 건 할 수 있습니다.

이렇듯 unknown 타입에는 어떤 것을 대입하는 것이 유효하지 않기 때문에

any 타입보다 더욱 안전합니다.

 

 

 

반면 any 타입은 어떨까요?

let anyValue: any
let hi:boolean = anyValue

any 타입은 never를 제외한 모든 타입에 할당하는 것이 가능합니다.

이는 치명적인 실수를 불러올 가능성을 만듭니다.

const anytype:any = true
const hi:string = anytype
hi.toUpperCase()

any 타입은 어느 타입에도 할당할 수 있기 때문에

개발자가 이러한 코드를 작성하더라도 오류를 발생시키지 않습니다.

하지만 런타임에서는 true.toUpperCase()를 하는것이나 다름없기 때문에

런타임 에러를 발생시킬 것입니다.

---

unknown 타입은 프로퍼티에 접근하기 / 메소드 호출하기 / 인스턴스 생성하기를 할 수 없습니다.

let anyValue: any
anyValue.toUpperCase()

위 예제를 보겠습니다.

any타입은 메서드 호출에 제한이 없습니다.

anyValue가 string이라는 보장이 없는데도

anyValue는 string 메서드 toUpperCase()를 호출하고있지만

타입스크립트는 이를 허용합니다.

let unknownValue: unknown
unknownValue.toUpperCase() // error!

반면 unknown 타입의 경우에는 error가 발생합니다.

이를 해결하기 위해서는 unknown 타입을 string으로 좁혀주어야합니다.

const unknownArgFunction = (value:unknown) => {
  value.toUpperCase() // unknown 타입에는 메서드를 호출할 수 없습니다.
  if(typeof value === 'string') {
    value.toUpperCase() // string으로 타입을 좁혀준 뒤 메서드를 호출합니다.
  }
}

---

😋 any와 unknown의 차이점 요약

 

any와 unknown의 차이는 크게 두가지로 요약할 수 있습니다.

1. unknown 타입은 any를 제외한 다른 타입에 할당할 수 없습니다. 

2. unknown 타입은 타입좁히기 없이는 메서드 호출, 인스턴스 생성,프로퍼티 접근을 할 수 없습니다.

---

😙이거 어디다 써요..?

unknown 타입은 any가 사용될 곳에 대체하여 사용할 수 있습니다.

unknown 타입을 사용해야 하는 이유는 좀 더 안전하게 코드를 작성할 수 있어지기 때문입니다.

타입스크립트를 사용하다보면 들어오게 될 인자의 타입을 예측할 수 없는 경우가 있습니다.

 

그러한 경우 unknown 타입이 없던 경우에는 any 타입을 사용할 수 밖에 없었고

이는 휴먼에러를 부르기 쉽지만

unknown 타입은 항상 타입을 먼저 확인 한 후에 무언가를 시도할 수 있기 때문에

any 타입보다 더욱 안전합니다.

---

🙄마치며

대충 any 비슷한거인데 좀 더 안전한 타입이라고 생각하고 unknown을 사용하다보니

타입좁히기가 강제되는 부분에서 불편을 겪은 경험이 있습니다.

왜 unknown을 사용하는지 , unknown의 사용의의를 알고나니

의도 된 불편함이었다는 것이 이해가 되네요

---

😐레퍼런스

https://www.typescriptlang.org/docs/handbook/type-compatibility.html#any-unknown-object-void-undefined-null-and-never-assignability

Documentation - Type Compatibility

https://jbee.io/typescript/TS-9-unknown/

[TS] 9. unknown Type

https://www.typescriptlang.org/ko/docs/handbook/2/functions.html#unknown

Documentation - More on Functions

https://tomdohnal.com/posts/typescript-any-vs-unknown-a-deep-dive

Tom Dohnal—Modern Frontend Development

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html#new-unknown-top-type

Documentation - TypeScript 3.0

https://overcurried.netlify.app/%EC%95%88%EC%A0%84%ED%95%9C%20any%20%ED%83%80%EC%9E%85%20%EB%A7%8C%EB%93%A4%EA%B8%B0/

안전한 any 타입 만들기 | overcurried