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 や空文字を有効な値として残したい場面では ?? を使うのが適切です。
