TypeScript

TypeScriptにおけるany型とunknown型の違いについて

anyもunknownもTypeScriptのユニバーサルタイプで、好きなものを割り当てることができます。

 


let exampleAny: any;
let exampleUnknown: unknown;

// I can assign anything to `any` type
exampleAny = {}
exampleAny = 123;

// I can also assign anything to `unknown` type
exampleUnknown = {}
exampleUnknown = 123;

 

では、その違いは何なのかと聞かれるかもしれません。

 

その違いは、そのバリューにアクセスを見ると多分わかりやすいです。


let exampleAny: any;
let exampleUnknown: unknown;

// Number.prototypeメソッドは、任意の場所でアクセスできます。
// 値が数値であるかどうかをチェックせずに
console.log(exampleAny.toFixed());

// unknownではNumber.prototypeメソッドにアクセスできません。
// 値が数値であるかどうかを確認せずに
console.log(exampleUnknown.toFixed());
// ‼️ エラーObject is of type 'unknown'

 

any を使用すると、@ts-ignore と同様に型チェックが無効になります。

 

unknownはany型のタイプセーフなカウンターパートです。

 

値にアクセスする前に、タイプアサーションまたはより特定の型への絞り込みが必要です。

 


// Number.prototypeメソッドにアクセスする前なので、問題ありません。
// 値のタイプが "number "であることを確認できるからです。
if (typeof exampleUnknown === "number") { 。
  console.log(exampleUnknown.toFixed());
}

 

おわりに、任意型と未知型の経験則

 

JavaScriptからTypeScriptのコードベースに移行するときだけany型を使い、それ以外はunknown型を使う。

 

意味のある型を定義するのが面倒だからといって、any型を割り当ててしまうと、カルマに捕まってしまいますよ。

 

参考にした記事

 

Pocket
LinkedIn にシェア

フロントエンド入門者へおすすめ動画&書籍おすすめ!

  • この記事を書いた人

藤沢瞭介(Ryosuke Hujisawa)

りょすけと申します。18歳からプログラミングをはじめ、今はフロントエンドでReactを書いたり、AIの勉強を頑張っています。off.tokyoでは、ハイテクやガジェット、それからプログラミングに関する情報まで、エンジニアに役立つ情報を日々発信しています!

1
2
no image 3
4
5
6
7
8
9
10
no image 11
12
13
14
15
16
17
18
19
20
21
22
23

-TypeScript