JavaScriptのtypeofとは | IT職種コラム

TOP
コラム
JavaScriptのtypeofと

JavaScriptとは

まず初めに、名前が似ていますが、JavaとJavaScriptは全くの別物です。
Javaの利用分野はさまざまな大規模システムです。例えば、SNSなどのWeb関連サービスやAndroidのスマホ向けアプリなどがあります。
一方JavaScriptの利用分野は、Webブラウザ上で動くシステムやサービスなど、Webサイトのページ制作です。また、ページの再読み込みなしで新しいコンテンツを読み込んでくれたり、Twitterなどでは再読み込みなしでサーバーに投稿することができます。簡単に書くと、WEBページの動作、WEBアプリ開発、スマホアプリ開発、ゲーム開発などが基本となります。

型

プログラミングの世界で扱う値のデータには、いくつかの種類が存在しています。それらデータの種類のことを一般的に「型」と呼びます。
プリミティブ (プリミティブデータ型) はメソッドを持たないデータのことです。プリミティブデータ型は6 種類あります。文字列、数値、BigInt、真偽値、undefined、シンボル、プリミティブに見える null もあります。

◇String (文字列型)：テキストの値を表す連続した文字("Hello" など)。
◇Number (数値)：整数または浮動小数点数。例えば 1,2,3,4,5や 3.141592など。
◇BigInt (長整数)：任意精度演算で表現される整数数値型の一種。
◇Boolean (論理型、真偽値型)：true(真)かfalse(偽)の値を取れる論理データ型。
◇undefined (未定義)：宣言のみが行われた変数や、実引数が存在しない仮引数に自動的に割り当てられる値。
◇Symbol ：JavaScriptでは、シンボル値は Symbol 関数を呼び出すことで生成される。
◇Object (オブジェクト)：データをやり取りするための命令が入ったデータ構造。
◇null： null という値は、存在しない、もしくは無効なオブジェクトやアドレスへのポインター参照を表しています。 null の意味は、言語実装によって様々で、JavaScript においては、null はプリミティブ値の一つであるとされています。

typeof

例えば、「"1+2"」と「1+2」はデータ型が違い、このままでは出力した際に内容が異なります。つまり求めている値を出力するために、プログラミングにおいて値の型はとても重要です。
普通、変数などは自分で宣言して利用するので自分で型を知っています。しかしどこからでも呼ばれる可能性がある関数やクラスなど使用する際は、引き渡された値の型を確認する必要がある場合があります。

構文はtypeof 値
のように「typeof」の後ろに判定したい値を記載します。

console.log (typeof 100 ) →　number
console.log (typeof 'Happy') →　 string
console.log (typeof true) →　boolean
console.log (typeof NaN) →　 number
console.log (typeof undefined) →　 undefined
console.log (typeof 30n) →　bigInt
console.log (typeof null) →　 object
null はあらゆるオブジェクトが null 値から派生しているので、「typeof」を使うと、objectが返ります。JavaScript は大文字・小文字を区別するので、Null や NULL などと同じではありません

他にも次の場合は…
typeof { }; 　　→　object
typeof [ ]; 　　→ object
typeof function() { }; → function
というふうになります。

わかりやすくまとめるとおおよそ、このようになります。

◎文字列　…　string
◎数値　… number
◎論理値　… boolean
◎未定義値 …　undefined
◎オブジェクト　… object
◎配列　… object
◎null　… object
◎関数　…　function

ただし、以下のようにNumber、String、Booleanの各オブジェクトは、objectです。

・typeof 10; →'number'　　　　　　　　 typeof new Number( 10 ); → 'object'
・typeof 'a'; →'string' 　　　　　　　　　 typeof new String( 'a' ); → 'object'
・typeof true; →'boolean' 　　　　　　　 typeof new Boolean( true ); → 'object'
・typeof Boolean( true ); →'boolean'

==

ここまで見たように、演算子が返す値は文字列なので、文字列と比較することもできます。

　var x = 831;
　　if (typeof x == "number"){
　　 console.log("xは数値型です");
　}

変数に含まれるデータ型をtypeofを使って取得し、データ型を表す文字列と比較すると、数値(x)に対するtypeofは「number」を返しますのでif文の条件式はtrueとなります。

instanceofとの違い

typeofに似た演算子に「instanceof」というものがあります。こちらは、オブジェクトの値が何の型を継承しているのかをチェックするために利用します。

①window.onload = function () {
　　var array= [10, 20, 30, 40, 50];　(⇦　配列はArrayでありObjectでもある)
　　　console.log(array instanceof Array);
　　　console.log(array instanceof Object);
　}

　実行結果　…　array instanceof Array =true
　　　　　　　　array instanceof Object = true

②window.onload = function () {
　　var array= [11,12,13,14,15];
　　　console.log(13 instanceof Number);
　　　console.log("Hello!" instanceof String);
　　　console.log(true instanceof Boolean);
　}
　実行結果　…　13 instanceof Number = false
　　　　　　　　"Hello!" instanceof String = false
　　　　　　　　true instanceof Boolean = false
　※プリミティブ型(②の方)にはinstanceofは使えません。

最後に…

今回のtypeofはnullの場合に「object」になるなど、思うような結果にならないこともありますが、使える型には有効なので、よく調べて使いこなしてみましょう。また最後に紹介した「instanceof」も合わせて使えるようにしましょう。