0️⃣
「`typeof` 演算子でアタフタしたけど、これでバッチリ！具体例で完全攻略✨」
typeof 演算子の結果ってこうなる⁉ 具体例も一緒に確認してみよう！🚀
JavaScriptで typeof 演算子を使うと、値の型が分かるんだけど、実際どんな風に動くのか具体例を見てみたいよね。そこで、以下にいくつかの具体例をまとめてみたよ！
typeof の結果に応じた型の一覧と具体例
| 型 |
typeof の結果 |
具体例 |
|---|---|---|
| Undefined | "undefined" |
let x; console.log(typeof x); // "undefined" |
| Null |
"object" (reason) |
let x = null; console.log(typeof x); // "object" |
| Boolean | "boolean" |
let x = true; console.log(typeof x); // "boolean" |
| Number | "number" |
let x = 42; console.log(typeof x); // "number" |
| BigInt | "bigint" |
let x = 123n; console.log(typeof x); // "bigint" |
| String | "string" |
let x = "hello"; console.log(typeof x); // "string" |
| Symbol | "symbol" |
let x = Symbol(); console.log(typeof x); // "symbol" |
| Function | "function" |
let x = function() {}; console.log(typeof x); // "function" |
| Class (as function) | "function" |
class MyClass {}; console.log(typeof MyClass); // "function" |
| Object | "object" |
let x = {}; console.log(typeof x); // "object" |
| Array (also object) | "object" |
let x = [1,2,3]; console.log(typeof x); // "object" |
| Object | "object" |
let x = {}; console.log(typeof x); // "object" |
| Array (also object) | "object" |
let x = [1, 2, 3]; console.log(typeof x); // "object" |
| Instance of a class | "object" |
let x = new Date(); console.log(typeof x); // "object" |
| Regular Expression (RegExp) | "object" |
let x = /abc/; console.log(typeof x); // "object" |
| Map | "object" |
let x = new Map(); console.log(typeof x); // "object" |
| Set | "object" |
let x = new Set(); console.log(typeof x); // "object" |
| WeakMap | "object" |
let x = new WeakMap(); console.log(typeof x); // "object" |
| WeakSet | "object" |
let x = new WeakSet(); console.log(typeof x); // "object" |
| Promise | "object" |
let x = new Promise(() => {}); console.log(typeof x); // "object" |
| Error | "object" |
let x = new Error(); console.log(typeof x); // "object" |
| TypedArray (e.g., Int8Array) | "object" |
let x = new Int8Array(); console.log(typeof x); // "object" |
| Node (e.g., HTMLElement) | "object" |
let x = document.createElement('div'); console.log(typeof x); // "object" |
補足
-
Nullの
typeofが"object"となる理由:- JavaScriptでは、
nullは意図的にどんな型のオブジェクトでも指すことができる特殊な値として扱われます。そのため、typeof nullの結果は"object"となります。
- JavaScriptでは、
結論
JavaScriptにおけるtypeof演算子の出力結果は、その値がどのような型であるかを理解する上で非常に重要です。特に、nullのケースや関数、配列、オブジェクトの区別については正しく理解しておく必要があります。
typeofの結果についてよくある「あるある」なポイントも押さえておきましょう：
-
typeof nullが"object"を返す理由に戸惑うことがあるかもしれませんが、これはJavaScriptの設計による仕様です。nullは常に"object"を返します。 -
関数は、普通のオブジェクトとは異なり、
typeofで"function"と表示されるので、関数であることがすぐに判別できます。 -
配列や特定のオブジェクト（例えば
Array、Date、RegExp、Mapなど）は、すべて"object"と表示されますが、Array.isArrayやinstanceofなどの補助的な方法を使って区別できます。
この表が、TypeScriptやJavaScriptにおける型の理解を深める助けになれば幸いです。typeof演算子の出力結果を使いこなして、より堅牢で理解しやすいコードを書いてみてくださいね！
😊 ぜひ試してみて、「あれ、これ本当にこうなるの？」って感じたら、気軽にコメントしてね。この記事がみんなの役に立つことを願っています。
Discussion