2022/12/07 - Any vs Unknown in Typescript

Any vs Unknown

let unknownValueNum : unknown = 10;
let unknownValueStr : unknown = 'Test';
let anyValueNum : any = 10;
let anyValueStr : any = 'Test'

console.log(anyValueNum.length) //undefined
console.log(anyValueStr.length) //4
if(typeof unknownValueStr==="string"){
    console.log(unknownValueStr.length) //4
}
console.log(unknownValueNum.length); // 'unknownValueNum' is of type 'unknown'.
console.log(unknownValueStr.length); // 'unknownValueStr' is of type 'unknown'.

언뜻보기에는 any와 unknown은 범위가 넓어보이니 용도가 같아보이지만, 위의 사례처럼 프로퍼티 또는 연산을 하는 경우 컴파일러가 체크한다

restProps와 같이 추가적인 속성이 들어올 수 있는 경우에는 다음과 같이 unknown[]를 사용하는 것이 좋다.(물론 사용하지 않는 경우라면 비워두는 것이 낫다)

 

export interface IA11yHiddenProps {
  as?: string;
  focusable?: boolean;
  children?: string;
  restProps: unknown[];
  forwardedAs?: string | React.ComponentType<any>;
}