JavaScript の種類

JavaScript typeof 演算子詳解

この文章では、JavaScript の typeof 演算子について掘り下げ、変数のデータ型を判別する方法を学び、その戻り値と一般的な使用例を探っていきます。

---

目次

---

1. typeof 演算子とは？

typeof 演算子は、オペランドの型を表す文字列を返すために使用されます。

  • 定義: オペランドの型を表す文字列を返します。
  • 構文: typeof operand または typeof (operand)
  • 戻り値: `"string"`、`"number"`、`"boolean"`、`"object"`、`"function"`、`"undefined"`、`"symbol"`、`"bigint"` などの文字列

2. typeof 演算子の戻り値

以下は、各戻り値とその意味、対応するデータ型の詳細です。

戻り値 意味 データ型
"string" 文字列 String
"number" 数値 Number
"boolean" 真偽値 Boolean
"object" オブジェクト (配列と null を含む) Object
"function" 関数 Function
"undefined" 未定義値 undefined
"symbol" Symbol 型の値 (ES6 で追加) Symbol
"bigint" BigInt 型の値 (ES2020 で追加) BigInt

3. typeof 演算子の特殊なケース

  • typeof null が "object" を返す理由: これは JavaScript の歴史的な理由によるもので、修正が困難な仕様上の問題となっています。
  • typeof NaN が "number" を返す理由: NaN (Not a Number) は、数値ではないことを表す特別な数値型であるためです。
  • 配列とオブジェクトの区別: typeof 演算子はどちらも "object" を返すため、区別できません。Array.isArray() メソッドや Object.prototype.toString.call() メソッドを使用する必要があります。

4. typeof 演算子の適用例

  • 変数が定義済みかどうかを確認する 
    
    <script>
      let myVariable;

      if (typeof myVariable !== 'undefined') {
        console.log('myVariable は定義されています');
      } else {
        console.log('myVariable は定義されていません');
      }
    </script>
  • 関数のパラメータの型を検証する 
    
    <script>
      function greet(name) {
        if (typeof name !== 'string') {
          console.error('名前は文字列である必要があります');
          return;
        }

        console.log('こんにちは、' + name + 'さん！');
      }

      greet('太郎'); // こんにちは、太郎さん！
      greet(123); // エラー：名前は文字列である必要があります
    </script>
  • プリミティブ値とオブジェクトを区別する 
    
    <script>
      function logValueType(value) {
        if (typeof value === 'object' || typeof value === 'function') {
          console.log(value + ' はオブジェクトです');
        } else {
          console.log(value + ' はプリミティブ値です');
        }
      }

      logValueType('こんにちは'); // こんにちは はプリミティブ値です
      logValueType({}); // [object Object] はオブジェクトです
    </script>

5. typeof 演算子の注意点

  • typeof 演算子は配列とオブジェクトを区別できません。区別するには、Array.isArray() メソッドや Object.prototype.toString.call() メソッドを使用する必要があります。
  • typeof 演算子は変数の現在の型のみを判定します。変数の値が変更された場合、型もそれに応じて変更されます。

6. typeof 演算子と他の型判定方法との比較

  • instanceof 演算子との比較:
    • typeof 演算子は、オペランドの基本的な型を返します。
    • instanceof 演算子は、オブジェクトが特定のプロトタイプチェーンに属しているかどうかを確認します。
  • Object.prototype.toString.call() メソッドとの比較:
    • typeof 演算子は、プリミティブ型とオブジェクトを区別できますが、オブジェクトの具体的な型を特定することはできません。
    • Object.prototype.toString.call() メソッドは、オブジェクトの内部 [[Class]] プロパティにアクセスするため、より正確な型情報を取得できます。
  • 各方法のメリット、デメリット、適用例:
    方法 メリット デメリット 適用例
    typeof シンプルで使いやすい オブジェクトの具体的な型を判定できない
    null の扱いに注意が必要    		 基本的な型の判定
    変数が定義済みかどうかを確認
    instanceof オブジェクトの継承関係を確認できる プリミティブ型には使用できない オブジェクトが特定のクラスのインスタンスかどうかを確認
    Object.prototype.toString.call() 最も正確な型情報を取得できる 他の方法に比べてやや複雑 あらゆる型の判定
    組み込みオブジェクトの型の判定

7. まとめ

この記事では、typeof 演算子の定義、構文、戻り値、適用例について学びました。typeof 演算子は JavaScript の型判定において重要な役割を果たします。ただし、null の扱い、配列とオブジェクトの区別など、いくつかの注意点もあります。他の型判定方法と比較して、適切な方法を選択することが重要です。

---

関連情報

よくある質問

Q1: typeof 演算子と instanceof 演算子の違いは何ですか？

A1: typeof 演算子はオペランドの基本的な型 (文字列、数値、ブール値など) を返し、instanceof 演算子はオブジェクトが特定のコンストラクタのプロトタイプチェーンに属しているかどうかを確認します。

Q2: typeof null が "object" を返すのはなぜですか？

A2: これは JavaScript の初期の実装における設計上の欠陥であり、現在では修正が困難な仕様となっています。

Q3: 配列を判定するにはどうすればよいですか？

A3: typeof 演算子は配列を "object" と判定するため、配列を specifically 判定するには Array.isArray() メソッドを使用します。