JavaScript・TypeScript 値と型の違いシミュレーター|undefined・null・0を比較

JavaScript / TypeScript Learning Tool

値と型の違いシミュレーター

undefined、null、0、false、空文字、型推論、any、unknown、== と ===、|| と ?? の違いを、
選択操作と判定結果で確認できます。

利用回数:

コード // コメントは結果 コピーできます

判定理由

使い方ガイド

上部のモードを切り替え、値や型を選ぶとコードと判定結果が即時に変わります。
JavaScriptの条件判定では、値が存在することとTruthyであることは同じではありません。
TypeScript型チェックは学習用の疑似判定です。実際のコンパイラ実行ではなく、代表的な型の違いを確認するための表示です。

よくある質問

undefined と null の違いは?

undefined は「変数に値がまだ入っていない(未定義)」状態を表し、null は「意図的に空であること」をプログラマが明示するための値です。typeof で調べると undefined は “undefined”、null は歴史的な理由で “object” になります。== では両者は同値とみなされますが、=== では型が異なるため等しくなりません。

== と === はどちらを使うべき?

=== は値と型の両方を厳密に比較し、== は必要に応じて暗黙の型変換をしてから比較します。== では 0 と空文字、null と undefined などが意図せず等しくなり混乱のもとになるため、基本は === を使うのが安全です。

any と unknown の違いは?

any は型チェックを無効にし、どんな操作も許してしまうため実行時エラーの危険があります。unknown は何でも代入できますが、使う前に typeof などで型を絞り込む必要があり、より安全です。型が不明な値には、できるだけ unknown を使うのが望ましいです。

|| と ?? はどう使い分ける?

|| は左辺が Falsy(false・0・空文字・null・undefined・NaN)のときに右辺を返します。?? は左辺が null か undefined のときだけ右辺を返します。0 や空文字を有効な値として残したい場面では ?? を使うのが適切です。

ご利用にあたっては、本Webアプリの 利用規約 も合わせてご確認ください。

バグや表示の乱れ、追加してほしい機能などがあれば、こちらよりお知らせください。

バグや表示の乱れ、使いにくかった点、追加してほしい機能などがあればお知らせください。
同意事項
・本フォームは不具合報告専用です。個別の返信は原則行っておりません。
・誹謗中傷、脅迫、公序良俗に反する内容が含まれる場合、IPアドレス等のログに基づきしかるべき対処を行います。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次