JavaScript 逆引き集 | typeof 判定(原始型)

JavaScript JavaScript
スポンサーリンク

typeof 判定(原始型) — typeof x === 'string'

JavaScript の typeof 演算子は「変数や値の型」を文字列で返します。
初心者は「この値は文字?数?それとも別の型?」を調べる道具と覚えると理解しやすいです。


基本のコード例

let x = "Hello";
console.log(typeof x); // → "string"

let y = 123;
console.log(typeof y); // → "number"

let z = true;
console.log(typeof z); // → "boolean"
JavaScript
  • typeof 値 → 型を文字列で返す。
  • よく使う判定:
    • typeof x === "string"
    • typeof x === "number"
    • typeof x === "boolean"

判定できる主な型

値例typeof の結果説明
"abc""string"文字列
123"number"数値(整数・小数)
true"boolean"真偽値
undefined"undefined"未定義
null"object"特殊ケース(歴史的仕様バグ)
Symbol("id")"symbol"シンボル型
10n"bigint"大きな整数
function() {}"function"関数
{}"object"オブジェクト
[]"object"配列(配列もオブジェクト扱い)

よく使うテンプレート集

文字列判定

function printUpper(x) {
  if (typeof x === "string") {
    console.log(x.toUpperCase());
  } else {
    console.log("文字列ではありません");
  }
}

printUpper("hello"); // "HELLO"
printUpper(123);     // "文字列ではありません"
JavaScript

数値判定

function double(x) {
  if (typeof x === "number") {
    return x * 2;
  }
  return NaN;
}

console.log(double(10));   // 20
console.log(double("10")); // NaN
JavaScript

関数判定

function runIfFunc(fn) {
  if (typeof fn === "function") {
    fn();
  } else {
    console.log("関数ではありません");
  }
}

runIfFunc(() => console.log("関数が呼ばれました"));
// → "関数が呼ばれました"
JavaScript

例題: 入力チェック関数

function checkInput(x) {
  if (typeof x === "string") {
    console.log("文字列です:", x);
  } else if (typeof x === "number") {
    console.log("数値です:", x);
  } else if (typeof x === "boolean") {
    console.log("真偽値です:", x);
  } else {
    console.log("その他の型です:", typeof x);
  }
}

checkInput("Hello"); // "文字列です: Hello"
checkInput(42);      // "数値です: 42"
checkInput(true);    // "真偽値です: true"
checkInput({});      // "その他の型です: object"
JavaScript

実務でのコツ

  • プリミティブ型判定に便利: string, number, boolean, undefined, symbol, bigint
  • null は注意: typeof null"object" になるのは仕様バグ。x === null で判定する。
  • 配列判定: typeof []"object"。配列判定は Array.isArray(x) を使う。
  • 関数判定: typeof fn === "function" が定番。

ありがちなハマりポイントと対策

  • null"object" になる:
    • 対策: x === null で判定。
  • 配列が "object" になる:
    • 対策: Array.isArray(x) を使う。
  • 数値文字列と数値の違い:
    • "10""string"
    • 10"number"

練習問題(型ごとに処理)

function processValue(x) {
  if (typeof x === "string") {
    console.log("文字列の長さ:", x.length);
  } else if (typeof x === "number") {
    console.log("数値の2倍:", x * 2);
  } else {
    console.log("その他の型:", typeof x);
  }
}

processValue("JavaScript"); // "文字列の長さ: 10"
processValue(7);            // "数値の2倍: 14"
processValue(true);         // "その他の型: boolean"
JavaScript

直感的な指針

  • typeof = 値の型を文字列で返す。
  • プリミティブ型判定に便利。
  • null と配列は特例に注意。
  • 初心者は「文字列判定」「数値判定」「関数判定」で練習すると理解しやすい。

これを覚えれば「入力チェック」「型ごとの処理分岐」「安全な関数呼び出し」ができるようになります。

タイトルとURLをコピーしました