メインコンテンツまでスキップ

typeof演算子 (typeof operator)

JavaScriptのtypeof演算子では値の型を調べることができます。

js
typeof true; //=> "boolean"
typeof 0; //=> "number"
typeof "Hello World"; //=> "string"
typeof undefined; //=> "undefined"
typeof null; //=> "object"
typeof Symbol(); //=> "symbol"
typeof 1n; //=> "bigint"
typeof [1, 2, 3]; //=> "object"
typeof { a: 1, b: 2 }; //=> "object"
typeof (() => {}); //=> "function"
js
typeof true; //=> "boolean"
typeof 0; //=> "number"
typeof "Hello World"; //=> "string"
typeof undefined; //=> "undefined"
typeof null; //=> "object"
typeof Symbol(); //=> "symbol"
typeof 1n; //=> "bigint"
typeof [1, 2, 3]; //=> "object"
typeof { a: 1, b: 2 }; //=> "object"
typeof (() => {}); //=> "function"

TypeScriptでtypeofを使うとifやswicthでその型として使うことができる

TypeScriptではtypeof演算子をifやswitchと併せてつかうと、条件と合致したときにその変数をその型として扱えるようになります。次の例はunknown型とされた変数ntypeof演算子によってstring型であると判別された例です。

ts
const n: unknown = "";
 
if (typeof n === "string") {
n.toU;
       
}
ts
const n: unknown = "";
 
if (typeof n === "string") {
n.toU;
       
}

nullを判別する

typeof演算子で特筆すべきなのは、値がnullの場合です。typeof nullの演算結果は"null"ではなく"object"です。誤解が起きやすい部分なので注意しましょう。特に値がオブジェクトかどうかを判定したいときは、typeof null"object"になることを意識して書かないと思いがけない不具合になることがあります。

js
// まずい実装
function isObject(value) {
return typeof value === "object"; // valueがnullになる場合を考慮していない
}
 
isObject(null); // 戻り値がtrueになってしまう
js
// まずい実装
function isObject(value) {
return typeof value === "object"; // valueがnullになる場合を考慮していない
}
 
isObject(null); // 戻り値がtrueになってしまう

typeof nullを考慮した実装は次のようになります。

js
function isObject(value) {
return value !== null && typeof value === "object";
}
js
function isObject(value) {
return value !== null && typeof value === "object";
}

ここで説明したのはJavaScriptのtypeof演算子です。TypeScriptのtypeof型演算子については、typeof型演算子の説明をご覧ください。

📄️ typeof型演算子

TypeScriptのtypeofは変数から型を抽出する型演算子です。次は、変数pointにtypeof演算子を用いて、Point型を定義する例です。このPoint型は次のような型になります。

配列を判別する

上記例にもあるとおり、配列をtypeofにかけると"object"となります。これは不具合でもなんでもなく、配列はオブジェクトであるのでそのように判別されます。

とはいえそれが配列かどうかを判別する機会は多いため、専用にArray.isArray()というメソッドがArrayオブジェクトにあります。

Array.isArray()を使ってtrueの戻り値が帰ってきた場合、その変数はany[]型であると判別されます。

ts
if (Array.isArray(n)) {
// n is any[]
}
ts
if (Array.isArray(n)) {
// n is any[]
}

any[]型を任意の型の配列として判別したい場合は各要素に対してtypeofArray.isArray()など型を調べる関数を使います。

📄️ unknown型

TypeScriptのunknown型は、型が何かわからないときに使う型です。

📄️ 型ガード関数

Type predicateの宣言は戻り値がboolean型の関数に対して適用でき、戻り値の型の部分を次のように書き替えます。
  • 質問する ─ 読んでも分からなかったこと、TypeScriptで分からないこと、お気軽にGitHubまで🙂
  • 問題を報告する ─ 文章やサンプルコードなどの誤植はお知らせください。