JavaScriptには、5つの異なるデータ型があります。
stringnumberbooleanobjectfunction
オブジェクトには次の6種類があります。
ObjectDateArrayStringNumberBoolean
値を含めることができない2つのデータ型です。
typeofのオペレーター
typeof演算子を使用して、JavaScriptの変数のデータ型を確認できます。
例
typeof "たろう" // Returns "string"
typeof 3.14 // Returns "number"
typeof NaN // Returns "number"
typeof false // Returns "boolean"
typeof [1,2,3,4] // Returns "object"
typeof {name:'John', age:34} // Returns "object"
typeof new Date() // Returns "object"
typeof function () {} // Returns "function"
typeof myCar // Returns "undefined"
typeof null // Returns "object"
自分で試してみる »
確認してください。
- NaNのデータ型はnumberです
- 配列のデータ型はobjectです
- 日付のデータ型はobjectです
- nullのデータ型はobjectです
- 未定義変数のデータ型はundefindです
- 値が割り当てられていない変数のデータ型はundefindです
JavaScriptのオブジェクトが配列（または日付）かどうかを判断するのにtypeofは使用できません。
Primitive (プリミティブ、基本データ型)
Primitive (プリミティブ)は、追加のプロパティやメソッドを持たないデータ型です。
typeof演算子は、次のデータ型のいずれかを返却します。
stringnumberbooleanundefined
例
typeof "たろう" // Returns "string"
typeof 3.14 // Returns "number"
typeof true // Returns "boolean"
typeof false // Returns "boolean"
typeof x // Returns "undefined" (if x has no value)
自分で試してみる »
複雑なデータ型
typeof演算子は、以下2つの複合型のいずれかを返却します。
typeof演算子は、オブジェクト、配列、および null に対して「object」を返却します。
typeof演算子は、関数に対しては「object」を返却しません。
例
typeof {name:'たろう', age:34} // Returns "object"
typeof [1,2,3,4] // Returns "object" (not "array", see note below)
typeof null // Returns "object"
typeof function myFunc(){} // Returns "function"
自分で試してみる »
JavaScriptでは配列はobjectなので、typeof演算子は配列に対して「object」を返却します。
typeofのデータ型
typeof演算子は変数ではありません。演算子( + - * / )にはデータ型がありません。
しかしtypeof演算子は常に文字列を返します(オペランドの型を含む)。
constructorプロパティ
constructorプロパティは、すべての変数のコンストラクター関数を返却します。
例
"たろう".constructor // Returns function String() {[native code]}
(3.14).constructor // Returns function Number() {[native code]}
false.constructor // Returns function Boolean() {[native code]}
[1,2,3,4].constructor // Returns function Array() {[native code]}
{name:'たろう',age:34}.constructor // Returns function Object() {[native code]}
new Date().constructor // Returns function Date() {[native code]}
function () {}.constructor // Returns function Function(){[native code]}
自分で試してみる »
オブジェクトがArray（"Array"という単語を含む）かどうかを調べるには、コンストラクタのプロパティをチェックします。
例
function isArray(myArray) {
return myArray.constructor.toString().indexOf("Array") > -1;
}
自分で試してみる »
または、もっと単純にオブジェクトがArray関数かどうかをチェックできます。
例
function isArray(myArray) {
return myArray.constructor === Array;
}
自分で試してみる »
オブジェクトがDate（"Date"という単語を含む）かどうかを調べるには、コンストラクタのプロパティをチェックします。
例
function isDate(myDate) {
return myDate.constructor.toString().indexOf("Date") > -1;
}
自分で試してみる »
または、もっと単純にオブジェクトがDate関数かどうかをチェックできます。
例
function isDate(myDate) {
return myDate.constructor === Date;
}
自分で試してみる »
Undefined
JavaScriptでは、値のない変数はundefindという値を持ちます。型も未定義です。
例
let car; // Value is undefined, type is undefined
自分で試してみる »
どの変数も、値をundefinedに設定することにより、任意の変数を空にすることができます。タイプも未定義になります。
例
car = undefined; // Value is undefined, type is undefined
自分で試してみる »
空の値
空の値はundefindとは関係ありません。
空の文字列には、有効な値と型の両方があります。
例
let car = ""; // The value is "", the typeof is "string"
自分で試してみる »
Null
JavaScriptにてnullは「無」です。存在しないという意味です。
しかしながら、JavaScript では、nullはオブジェクトです。
typeof nullがオブジェクトであることは、JavaScriptのバグと考えることができます。nullであるべきです。
nullを設定することでオブジェクトを空にできます。
例
let person = {firstName:"たろう", lastName:"山田", age:50, birthPlace:"愛媛"};
person = null; // Now value is null, but type is still an object
自分で試してみる »
undefinedを設定してオブジェクトを空にすることもできます。
例
let person = {firstName:"たろう", lastName:"山田", age:50, birthPlace:"愛媛"};
person = undefined; // Now both value and type is undefined
自分で試してみる »
undefinedとNullの違い
undefinedとnullは同じ値ですが、型が異なります。
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
自分で試してみる »
演算子のインスタンス
instanceof演算子は、オブジェクトが指定されたオブジェクトのインスタンスである場合trueを返却します。
例
const cars = ["Toyota", "Volvo", "BMW"];
(cars instanceof Array);
(cars instanceof Object);
(cars instanceof String);
(cars instanceof Number);
自分で試してみる »
void演算子
void 演算子は式を評価し、未定義を返却します。この演算子は、"void(0)" を使用して未定義のプリミティブ値を取得するためによく使用されます（戻り値を使用せずに式を評価する場合に便利です）。
例
<a href="javascript:void(0);">
Useless link
</a>
<a href="javascript:void(document.body.style.backgroundColor='red');">
Click me to change the background color of body to red
</a>
自分で試してみる »
