JavaScript typeof 演算子

1. typeof 演算子 (The typeof Operator)

typeof 演算子は、JavaScript 変数のデータ型（Data Type）を返します。

1.1 プリミティブデータ型 (Primitive Data Types)

JavaScriptにおいて、プリミティブ値（Primitive value）はプロパティやメソッドを持たない単一の値です。
JavaScriptには以下の7つのプリミティブデータ型が存在します：

• string
• number
• boolean
• bigint
• symbol
• null
• undefined

typeof 演算子は、変数または式の型を文字列として返します。

使用例

typeof "John"          // string を返す
typeof ("John"+"Doe")  // string を返す
typeof 3.14            // number を返す
typeof 33              // number を返す
typeof (33 + 66)       // number を返す
typeof true            // boolean を返す
typeof false           // boolean を返す
typeof 1234n           // bigint を返す
typeof Symbol()        // symbol を返す
typeof x               // undefined を返す

typeof null            // object を返す

JavaScriptにおいて、null はプリミティブ値ですが、typeof は object を返します。これはJavaScriptにおける有名なバグであり、歴史的経緯による仕様です。

2. 複合データ型 (Complex Data Types)

複合データ型は、複数の値や異なるデータ型をまとめて格納できる型です。
JavaScriptの主要な複合データ型は以下の1つです：

• object

配列（Array）、セット（Set）、マップ（Map）などの他のすべての複合タイプは、本質的にはオブジェクトの異なる形態に過ぎません。typeof 演算子が複合型に対して返すのは、以下の2つのいずれかのみです：

• object
• function

使用例

typeof {name:'John'}   // object を返す
typeof [1,2,3,4]       // object を返す
typeof new Map()       // object を返す
typeof new Set()       // object を返す

typeof function (){}   // function を返す

typeof 演算子は、以下のすべてのオブジェクト型に対して object を返します：

• オブジェクト（Objects）
• 配列（Arrays）
• 日付（Dates）
• セット（Sets）
• マップ（Maps）

そのため、typeof を使って JavaScript オブジェクトが配列なのか日付なのかを判別することはできません。

3. 配列（Array）の識別方法

ある変数が配列であるかどうかを正確に知るにはどうすればよいでしょうか？
ECMAScript 5 (2009) で定義された Array.isArray() メソッドを使用します。

使用例

// 配列（Array）を作成
const fruits = ["apples", "bananas", "oranges"];
Array.isArray(fruits); // true を返す

4. instanceof 演算子

instanceof 演算子は、オブジェクトが指定されたオブジェクト型のインスタンスである場合に true を返します。

使用例

// 日付（Date）オブジェクトを作成
const time = new Date();
(time instanceof Date);     // true を返す

// 配列（Array）を作成
const fruits = ["apples", "bananas", "oranges"];
(fruits instanceof Array);  // true を返す

// マップ（Map）を作成
const fruitMap = new Map([
  ["apples", 500],
  ["bananas", 300]
]);
(fruitMap instanceof Map);  // true を返す

// セット（Set）を作成
const fruitSet = new Set(["apples", "bananas", "oranges"]);
(fruitSet instanceof Set);  // true を返す

5. 未定義の変数 (Undefined Variables)

定義されていない変数の typeof は undefined です。

使用例

typeof car; // undefined を返す

また、値が代入されていない変数の typeof も undefined であり、その値自体も undefined です。

let car;
typeof car; // undefined を返す

変数の値を undefined に設定することで、変数を空にすることも可能です。その場合、型も undefined になります。

let car = "Volvo";
car = undefined; // 値も型も undefined になる

6. 空の値 (Empty Values)

空の値（Empty value）は、undefined とは異なります。
空の文字列は、有効な値と型（string）の両方を持っています。

使用例

let car = "";
typeof car; // string を返す

7. Null について

JavaScript において、null は「無（Nothing）」を意味します。存在しない何かを表すための値です。
残念ながら、前述の通り JavaScript では null のデータ型は object として扱われます。

オブジェクトに null を代入することで、オブジェクトを空にできます：

// オブジェクトの作成
let person = {firstName:"John", lastName:"Doe", age:50};

person = null;
// 値は null ですが、型は依然として object です

オブジェクトに undefined を代入して空にすることも可能です：

let person = {firstName:"John", lastName:"Doe", age:50};

person = undefined;
// 値と型の両方が undefined になります

7.1 Undefined と Null の違い

undefined と null は、値としては等しいですが、型が異なります。

typeof undefined      // undefined
typeof null           // object

null === undefined    // false (厳密等価比較)
null == undefined     // true  (等価比較)

8. constructor プロパティ

constructor プロパティは、すべての JavaScript 変数のコンストラクタ関数（Constructor function）を返します。

使用例

{name:'John',age:34}.constructor    // function Object() {[native code]} を返す
[1,2,3,4].constructor              // function Array() {[native code]} を返す
new Date().constructor             // function Date() {[native code]} を返す
new Set().constructor              // function Set() {[native code]} を返す
new Map().constructor              // function Map() {[native code]} を返す
function () {}.constructor         // function Function() {[native code]} を返す

constructor プロパティを利用して、オブジェクトが配列や日付であるかをチェックできます。

(myArray.constructor === Array); // 配列なら true
(myDate.constructor === Date);   // 日付なら true

9. まとめ (Summary)

主要な型と typeof の結果一覧：

       注意:NaN (Not a Number) のデータ型は number です。

10. void 演算子

void 演算子は、式を評価し、結果として undefined を返します。
この演算子は、プリミティブ値としての undefined を取得するために void(0) の形式でよく使われます（評価した式の戻り値を利用したくない場合に有用です）。

使用例

<a href="javascript:void(0);">
  機能しないリンク
</a>

<a href="javascript:void(document.body.style.backgroundColor='red');">
  背景を赤にする
</a>