ホーム » JavaScriptチュートリアル » JavaScriptのデータ型

JavaScriptのデータ型

概要: このチュートリアルでは、JavaScriptのデータ型とそのユニークな特性について学びます。

JavaScriptには、以下のプリミティブデータ型があります。

  1. null
  2. undefined
  3. boolean
  4. number
  5. string
  6. symbol – ES2015から利用可能
  7. bigint – ES2020から利用可能

そして、複合データ型であるobjectがあります。

JavaScript data types

JavaScriptは動的型付け言語です。つまり、変数は特定の型に関連付けられていません。言い換えれば、変数は異なる型の値を保持できます。例えば

let counter = 120; // counter is a number
counter = false;   // counter is now a boolean
counter = "foo";   // counter is now a stringCode language: JavaScript (javascript)

変数に格納されている値の現在の型を判断するには、typeof演算子を使用します。

let counter = 120;
console.log(typeof(counter)); // "number"

counter = false; 
console.log(typeof(counter)); // "boolean"

counter = "Hi";
console.log(typeof(counter)); // "string"Code language: JavaScript (javascript)

出力

"number"
"boolean"
"string"Code language: JSON / JSON with Comments (json)

undefined型

undefined型は、値がundefinedのみのプリミティブ型です。デフォルトでは、変数が宣言されていても初期化されていない場合、デフォルトでundefinedになります。

次の例を考えてみましょう。

let counter;
console.log(counter);        // undefined
console.log(typeof counter); // undefinedCode language: JavaScript (javascript)

この例では、counterは変数です。counterは初期化されていないため、undefinedという値が割り当てられます。counterの型もundefinedです。

宣言されていない変数に対してtypeof演算子を呼び出すと、undefinedが返されることに注意することが重要です。

console.log(typeof undeclaredVar); // undefinedCode language: JavaScript (javascript)

null型

null型は、値がnullのみの2番目のプリミティブデータ型です。例えば

let obj = null;
console.log(typeof obj); // objectCode language: JavaScript (javascript)

typeof nullがobjectを返すのは、JavaScriptの既知のバグです。修正案は、多くの既存のサイトを壊す可能性があるため却下されました。

JavaScriptでは、nullはundefinedと等しいと定義されています。

console.log(null == undefined); // trueCode language: JavaScript (javascript)

number型

JavaScriptは、整数と浮動小数点数の両方を表すためにnumber型を使用します。

次のステートメントは、変数を宣言し、その値を整数で初期化します。

let num = 100;Code language: JavaScript (javascript)

浮動小数点数を表すには、小数点の後に少なくとも1つの数字を含めます。例えば

let price = 12.5; 
let discount = 0.05;Code language: JavaScript (javascript)

JavaScriptは、数値が整数に見える場合、浮動小数点数を自動的に整数に変換することに注意してください。

その理由は、浮動小数点値は整数値の2倍のメモリを使用するため、Javascriptは常にメモリ使用量を少なくしようとするためです。例えば

let price = 200.00; // interpreted as an integer 200Code language: JavaScript (javascript)

number型の範囲を取得するには、Number.MIN_VALUEとNumber.MAX_VALUEを使用します。例えば

console.log(Number.MAX_VALUE); // 1.7976931348623157e+308
console.log(Number.MIN_VALUE); // 5e-324Code language: JavaScript (javascript)

また、無限数を表すためにInfinityと-Infinityを使用することもできます。例えば

console.log(Number.MAX_VALUE + Number.MAX_VALUE); // Infinity
console.log(-Number.MAX_VALUE - Number.MAX_VALUE); // -InfinityCode language: JavaScript (javascript)

NaN

NaNは、非数（Not a Number）の略です。無効な数値を示す特別な数値です。例えば、文字列を数値で除算するとNaNが返されます。

console.log('a'/2); // NaN;Code language: JavaScript (javascript)

NaNには、2つの特別な特性があります。

  • NaNを含む演算は、NaNを返します。
  • NaNは、それ自体を含むどの値とも等しくありません。

いくつかの例を次に示します。

console.log(NaN/2); // NaN
console.log(NaN == NaN); // falseCode language: JavaScript (javascript)

string型

JavaScriptでは、文字列はゼロ個以上の文字のシーケンスです。文字列リテラルは、単一引用符（'）または二重引用符（"）で始まり、終わります。

二重引用符で始まる文字列は二重引用符で終わる必要があり、単一引用符で始まる文字列も単一引用符で終わる必要があります。例えば

let greeting = 'Hi';
let message  = "Bye";Code language: JavaScript (javascript)

リテラル文字列で単一引用符または二重引用符を使用する場合は、バックスラッシュを使用してエスケープする必要があります。例えば

let message = 'I\'m also a valid string'; // use \ to escape the single quote (')Code language: JavaScript (javascript)

JavaScriptの文字列は不変です。つまり、一度作成されると変更できません。ただし、既存の文字列から新しい文字列を作成することはできます。例えば

let str = 'JavaScript';
str = str + ' String';Code language: JavaScript (javascript)

この例では

  • まず、str変数を宣言し、'JavaScript'という文字列で初期化します。
  • 次に、+演算子を使用して、'JavaScript'と' String'を結合し、その値を'Javascript String'にします。

バックグラウンドでは、JavaScriptエンジンは新しい文字列'JavaScript String'を保持する新しい文字列を作成し、元の文字列'JavaScript'と' String'を破棄します。

次の例では、文字列JavaScriptの最初の文字を変更しようとします。

let s = 'JavaScript';
s[0] = 'j';
console.log(s)Code language: JavaScript (javascript)

出力は次のとおりです。

'JavaScript'Code language: JavaScript (javascript)

ではなく

'javaScript'Code language: JavaScript (javascript)

boolean型

boolean型には、小文字のtrueとfalseの2つのリテラル値があります。次の例では、ブール値を保持する2つの変数を宣言しています。

let inProgress = true;
let completed = false;

console.log(typeof completed); // booleanCode language: JavaScript (javascript)

JavaScriptでは、他の型の値をtrueまたはfalseのブール値に変換できます。

他の型の値をブール値に変換するには、Boolean()関数を使用します。

次の表に変換ルールを示します。

型truefalse
string空でない文字列空の文字列
numberゼロ以外の数値とInfinity0、NaN
オブジェクトnull以外のオブジェクトnull
undefined undefined

例えば

console.log(Boolean('Hi'));// true
console.log(Boolean(''));  // false

console.log(Boolean(20));  // true
console.log(Boolean(Infinity));  // true
console.log(Boolean(0));  // false

console.log(Boolean({foo: 100}));  // true on non-empty object
console.log(Boolean(null));// falseCode language: JavaScript (javascript)

symbol型

JavaScriptはES6で新しいプリミティブ型であるsymbolを導入しました。他のプリミティブ型とは異なり、symbol型にはリテラル形式がありません。

シンボルを作成するには、次のようにSymbol関数を呼び出します。

let s1 = Symbol();Code language: JavaScript (javascript)

Symbol関数は、呼び出すたびに新しい一意の値を作成します。

console.log(Symbol() == Symbol()); // falseCode language: JavaScript (javascript)

シンボルの詳細については、シンボルチュートリアルを参照してください。

bigint型

bigint型は、253 – 1より大きい整数を表します。bigintリテラル数値を形成するには、数値の末尾に文字nを追加します。

let pageView = 9007199254740991n;
console.log(typeof(pageView)); // 'bigint'Code language: JavaScript (javascript)

bigint型の詳細はこちらをご覧ください。

object型

JavaScriptでは、オブジェクトとは、プロパティの集合であり、各プロパティはキーと値のペアとして定義されます。

次の例では、オブジェクトリテラル構文を使用して空のオブジェクトを定義しています。

let emptyObject = {};Code language: JavaScript (javascript)

次の例では、firstNameとlastNameの2つのプロパティを持つpersonオブジェクトを定義しています。

let person = {
    firstName: 'John',
    lastName: 'Doe'
};Code language: JavaScript (javascript)

オブジェクトのプロパティ名は、任意の文字列にすることができます。有効な識別子でない場合は、プロパティ名を引用符で囲むことができます。

例えば、personオブジェクトにfirst-nameというプロパティがある場合、"first-name"のように引用符で囲む必要があります。

オブジェクトのプロパティは、オブジェクトを保持できます。例えば

let contact = {
    firstName: 'John',
    lastName: 'Doe',
    email: '[email protected]',
    phone: '(408)-555-9999',
    address: {
        building: '4000',
        street: 'North 1st street',
        city: 'San Jose',
        state: 'CA',
        country: 'USA'
    }
}Code language: JavaScript (javascript)

contactオブジェクトには、firstName、lastName、email、phone、addressプロパティがあります。

addressプロパティ自体には、building、street、city、state、countryプロパティを持つオブジェクトが保持されています。

オブジェクトのプロパティにアクセスするには、次のものを使用できます。

  • ドット表記（.）
  • 配列のような表記（[]）

次の例では、ドット表記（.）を使用して、contactオブジェクトのfirstNameプロパティとlastNameプロパティにアクセスしています。

console.log(contact.firstName);
console.log(contact.lastName);Code language: CSS (css)

存在しないプロパティを参照すると、undefined値が返されます。例えば

console.log(contact.age); // undefinedCode language: JavaScript (javascript)

次の例では、配列のような表記を使用して、contactオブジェクトのemailプロパティとphoneプロパティにアクセスしています。

console.log(contact['phone']); // '(408)-555-9999'
console.log(contact['email']); // '[email protected]'Code language: JavaScript (javascript)

まとめ

  • JavaScriptには、number、string、boolean、null、undefined、symbol、bigintというプリミティブ型と、objectという複合型があります。
このチュートリアルは役に立ちましたか？
JavaScript Variables
前へ
JavaScript変数
次へ
JavaScript数値
JavaScript Numbers