티스토리 뷰
Unknown과 any
두 타입 모두 타입을 지정하기 애매할때 사용한다. 두 타입의 차이점은 뭔지 궁금해서 찾아보았다. 아래 예시를 보자.
function prettyPrint(x: unknown): string {
if (Array.isArray(x)) {
return "[" + x.map(prettyPrint).join(", ") + "]"
}
if (typeof x === "string") {
return `"${x}"`
}
if (typeof x === "number") {
return String(x)
}
return "etc."
}
x라는 parameter는 unknown타입이다. 따라서 x에는 모든 타입이 올 수 있다.
그리고 나서 함수 내부에서 x의 타입을 좁혀서 사용하면 된다.
물론 x가 any타입이었어도 위와 같은 형태로 타입을 좁혀서 사용할 수 있다. 그럼 무슨 차이인가?
import isArray from "isarray"
function prettyPrint(x: any): string {
if (isArray(x)) { // whoops - this `isArray` is not a type guard!
return "[" + x.mop(prettyPrint).join(", ") + "]"
}
/* snip */
return "etc."
}
isarray라고 하는 npm 모듈을 설치했다고 가정해보자. 이 모듈에는 타입정의가 포함되어 있지 않다고 하면, isArray(x)를 호출 했을때 당연히 x에 대한 타입 검증이 이뤄지지 않을것이다.
여기서 any와 unknown의 차이가 나타난다.
위에서 x가 any타입이기 때문에 컴파일타임에 에러가 검출되지 않는다. any타입은 타입을 지정하지 않은것과 마찬가지기 때문이다.
만약에 위 x가 unknown타입이었다면 isArray에 x를 전달했을때 아래와 같은 컴파일 에러가 발생한다.
Object is of type ‘unknown’.
이건 마치, 타입스크립트 컴파일러가 개발자에게
x가 unknown타입이라서 뭔지 잘 모르겠으니까 너가 타입을 정확히 지정해줘 라고 말하는것과 같다.
unknown은 무조건 타입을 좁혀서 사용해야 하는 의무가 있는 반면,
any는 타입을 좁혀서 사용하지 않아도 되서 자유롭다는 차이점이 있다.
그래서 any보다는 unknown을 사용하는것이 좀 더 안전하게 코딩을 할 수 있는 방법이다.
'Typescript' 카테고리의 다른 글
typescript의 unknown과 never 타입 (1) | 2020.07.16 |
---|---|
typescript의 never타입 (0) | 2020.07.16 |
스토리북 typescript bug, import된 타입을 불러오지 못하는 현상 (0) | 2020.05.29 |
fork-ts-checker-webpack-plugin 란 (0) | 2020.05.29 |
typescript + react eslint룰 설정 (0) | 2020.05.29 |
댓글
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- state
- props
- react
- atomic design
- reducer
- webpack
- es6
- reflow
- typescript
- useEffect
- design system
- await
- javascript
- Polyfill
- Next.js
- Action
- return type
- reactdom
- rendering scope
- type alias
- hydrate
- async
- useRef
- server side rendering
- react hooks
- promise
- mobx
- computed
- Babel
- storybook
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
글 보관함