typeof typeof によるナローイング
最終更新：2026-10-22
typeof typeof によるナローイング
typeof ガードは最もよく使われる型ガードです。実行時に typeof で値の型文字列を調べると、TypeScript はその判定に沿ってユニオン型を対応する分岐へナローイングます。たとえば typeof value === "string" の後では、value は string として扱われ、文字列のメソッドを安心して呼び出せます。
| グループ | ナローイングとアサーション |
|---|---|
| 種類 | 演算子 |
| strict モード | 不要 |
ℹ️ 説明 エディタは TypeScript を JavaScript にトランスパイルして実行します（型チェックなし）。型チェック結果は各サンプルの出力を参照してください。
📝 構文
function toNumber(value: string | number): number {
if (typeof value === "string") {
return Number(value); // ここで value: string
}
return value; // ここで value: number
}⚙️ パラメータ
| typeof value | 実行時に評価され、"string" / "number" / "boolean" / "object" / "function" / "undefined" / "symbol" / "bigint" の8種類の文字列のいずれかを返します |
|---|
戻り値：typeof 式そのものは型文字列を返します。ナローイングの効果はコンパイル時に発生し、分岐内の変数の型が対応する具体的な型に置き換わります。
▶ サンプル
下のコードを編集して「試す」を押すと、トランスパイル実行結果を確認できます：
出力：
string of length 5
number, doubled = 42
boolean: off
（トランスパイル後の実行出力。各 case 内で value.length や value * 2 が型チェックを通るのは、typeof によるナローイングが効いているからです。ナローイングは tsc が静的に保証し、実行時に見えるのは値だけです）💡 ポイント
ℹ️ 説明 typeof null === "object" は JS の歴史的な仕様です。TS はこれを組み込みで処理しており、typeof チェック後の null 分岐は正しく絞り込まれ、"object" 分岐に混入しません。
⚠️ 注意 typeof は配列と普通のオブジェクトを区別できません。どちらも "object" を返します。配列を区別するには Array.isArray(x) を、具体的なオブジェクトの形を区別するには in や判別可能ユニオンを使いましょう。
💡 ヒント typeof には2つの顔があります。値の位置では実行時演算子、型の位置では型演算子（type T = typeof someVar で変数の型を取る）です。ここで扱うのは前者のナローイング用法です。
🏷️ 関連ナローイングとアサーション
💡 関連ケース
ケースは今後追加予定です。
📚 関連チュートリアル
❓ よくある質問
Q typeof で判定しても配列が object のままなのはなぜですか？
A JS では配列もオブジェクトであり、typeof は一律 "object" を返します。TS は配列を絞り込むための専用ガード Array.isArray() を用意してあり、string | number[] のようなユニオンを扱う正しい道具はこちらです。
Q switch (typeof value) と連続した if に違いはありますか？
A ナローイングの効果はまったく同じで、どちらも TS が認識するガード形式です。分岐が3つを超えるなら switch の方が読みやすく、網羅性チェック（default で never を使う）と組み合わせれば分岐漏れも防げます。
Q typeof value === "string" が実行時にエラーになることはありますか？
A いいえ。typeof は任意の式に対して安全に評価できる数少ない演算子で、未宣言の変数でも単に "undefined" を返すだけです。この安全性こそ、型ガードに向いている理由です。
