変数のデータタイプ

変数には文字列や数値、論理値といったデータの種類（型）があります。JavaScriptでは型を宣言する必要はありませんが、それぞれの型の性質を理解することは重要です。データ型を大別するとプリミティブ型、複合型（オブジェクト）、特殊な型に分かれます。プリミティブ型は値をひとつだけ持つ基本的な型で、文字列型、数値型、論理型といった種類があります。複合型はオブジェクトや配列で、複数の値を持つことができます。

プリミティブ型

オブジェクトや配列は型を値として持つことができる複合型ですが、プリミティブ型は基本的な型で、プロパティやメソッドを持ちません。

プリミティブ型

• 文字列型（String）
• 数値型（Number）
• 論理型（Boolean）

複合型（オブジェクト）

• オブジェクト（Object）
• 配列（Array）

特別な型

• Null型
• 未定義型（Undefined）

文字列型（String）

文字列は、ダブルクォート（ " ）、またはクォーテーション（ ' ）で囲まれた値です。シングルクォーテーション（ ' ）を使用すると、ダブル クォーテーション（ " ）を含む文字列を指定することができます。

文字列は、ダブルクォーテーション（ " ）、またはクォーテーション（ ' ）で囲まれた値です。シングルクォーテーション（ ' ）を使用すると、ダブルクォーテーション（ " ）を含む文字列を指定することができます。 逆もまた然りです。

"Hello"

//数字をダブルクォートで囲んでも文字列になります。
"1234"

//文字列中にダブルクォーテーションがある場合
'say "Hello"'

エスケープシーケンス

文字列中でタブや改行などの特殊な文字は、バックスラッシュとそれに続く文字の２文字で表現できます。例えばタブを表す\tや、改行を表す\nなどがあり、これらの文字をエスケープシーケンスと呼びます。

それでは、エスケープシーケンスを使って改行を出力してみましょう。

コンソールで確認しよう

// 改行のエスケープシーケンス
"say\nHello."
// タブのエスケープシーケンス
"say\tHello."

出力結果

say
Hello.
say	Hello.

ダブルクォートやシングルクォートを文字列中で使いたい際も、バックスラッシュでエスケープすることができます。たとえば、バックスラッシュ自体を文字列中で使いたい場合、バックスラッシュでエスケープして\\と記述すれば\を表すようになります。

「say "Hello".」を代入するには、以下のようにバックスラッシュでダブルクォーテーションをエスケープします。

コンソールで確認しよう

"say \"Hello\"."

出力結果

say "Hello".

ただし、シングルクォーテーションで文字列を囲った場合はダブルクォーテーションをエスケープする必要ありません。これはシングルクォーテーションでダブルクォーテーションで囲んだ場合でも同じです。

コンソールで確認しよう

'say "Hello".'

出力結果

say "Hello".

JavaScriptはシングルクォートとダブルクォートに違いはなく、エスケープシーケンスはどちらでも同じように実行されます。

※1　バックスラッシュは、多くの日本語のフォントでは円マーク（ \ ）が割り当てられています。

文字列の連結

文字列は + 演算子で結合できます。

var s = "To be, or not to be. " +
	"that is the question.";

結合ではなく、長い文章を数行に分けて書きたい場合、各行の最後でバックスラッシュ（ \ ）を使うとエラーになりません。バックスラッシュの後には、改行以外の文字は使えません。

var s = "To be, or not to be. \
	that is the question.";

`（バッククオート）で文字列を囲むと、改行記号なしに複数行の文字列を書くことができます。

var s = `To be, or not to be.
	that is the question.`;

数値型（Number）

数値 （Number）には、整数値、浮動小数点値があります。

整数（Intergers）

整数を表現する場合には、8進数、10進数、16進数を使うことができます。

8進数の整数であることを示すには、先頭に0を付けます。各桁には、0～7の数字を使用します。先頭に0が付いても、各桁に8や9を使用している数値があれば、それは10進数として処理されます。

16進数（Hex）の整数であることを示すには、先頭に0x（xは大文字でも小文字でもかまいません）を付けます。各桁には、0～9の数字およびA～Fの英字（大文字でも小文字でもかまいません）を使用します。A～Fの英字は、1桁分の数値を表すのに使用され、10進数での10～15に相当します。たとえば、0xFは15、0x10は16に相当します。

8進数と16進数は負の値を表わせますが、小数点、指数表記（後述しています）は負の値を表わせません。

コンソールに8進数や16進数を入力すると自動的に10進数に変換されます。

コンソールで確認しよう

0377	// 8 進数。10進数に変換され255が出力されます。

0Xff	// 16 進数の整数。10進数に変換され255が出力されます。

数字であっても、ダブルクオーテーションで囲んで文字列として扱うと、それ以降は文字列として扱われます。たとえば、数値の10と1を足すと11になりますが、10をダブルクオーテーションで囲って文字列として扱った場合、文字列の連結として扱われて結果は101という文字列になります。

コンソールで確認しよう

var a = "10"; 
var b = 1; 

a + b;

出力結果

101

一度文字列として扱われた変数も、Number()関数を使うことによって数値として扱うことができます。数値に変換出来ない文字が含まれていた場合、Number()はNuNを返します。

コンソールで確認しよう

var a = "10"; 
Number( a ) + 1;

出力結果

11

parseInt()メソッドも文字列を数値に変換することができます。この関数は省略可能な第2引数として変換の基数を受け取ります。

parseInt( 文字列, 基数 );

parseInt()は第1引数の先頭が数値であれば、その後に続く文字列は無視して数値に変換します。

コンソールで確認しよう

// 10進数に変換
parseInt( "8px", 10 );

// 10進数に変換
parseInt( "08", 10 );

出力結果

8
8

文字列を少数として扱いたい場合はparseFloat()メソッドを使います。

浮動少数（Floating Point）

浮動小数は、小数点をピリオド（ . ）で表した10進数で表現されます。

// 浮動小数です
0.01

// 1以下の場合1桁の0は省略できます
.01

指数表記

桁が大きな数値や小数点以下が長い数値などは、「◯◯の何乗」という形で短縮すると扱いやすくなります。指数はeで桁を表した数値です（eは大文字でも可です）。「1e+2」の「+2」は2桁ずらすことを意味します。プラス（ + ）は省略でききます。

コンソールで確認しよう

1e+1

出力結果

10

コンソールで確認しよう

1e+2

出力結果

100

コンソールで確認しよう

5e+2

出力結果

500

指数表記で小数点を扱ってみましょう。「1e-2」のようにマイナスを使った場合、桁をマイナス方向にずらします。

コンソールで確認しよう

5e-2

出力結果

0.05

論理型（Boolean）

論理値は、真（ true ）か偽（ false ）のどちらかの値を持つ型です。条件式で使われる0 、null、undefined、空文字などは偽（ false ）と見なされます。したがって、次に示すif分の条件式は全て偽となり、何も出力されません。

if ( 0 ){
	console.log( "0は偽" );
}
if ( null ){
	console.log( "nullは偽" );
}
if ( undefined ){
	console.log( "undefinedは偽" );
}

空文字やnull以外であれば、文字列なども真となります。次の条件式は全て真を返します。

コンソールで確認しよう

if ( 1 ){
	console.log( "1は真" );
}
if ( "Hello" ){
	console.log( '"Hello"は真' );
}

出力結果

1は真
Hello"は真

未定義型(Undefined)

コンソールで確認しよう

var val;
console.log( val );

undefined は真偽値のコンテキストで使用されると false として振る舞うので、変数が未定義かどうかの判定に使えます。

コンソールで確認しよう

var x;
if( x === undefined ){
	console.log("xは未定義")
} else {
	console.log("xは定義済み")
}

出力結果

xは未定義

未定義型は値を代入していない変数の値を表します。この型はundefinedという値一種類のみです。次のように、値を代入していない変数を利用した場合、undefinedが返されます。

var x;
console.log(x);

undefinedは真偽値のコンテキストで使用されるとfalseとして振る舞うので、変数が未定義かどうかの判定に使えます。

コンソールで確認しよう

var x;
if( x === undefined ){
	console.log("xは未定義")
} else {
	console.log("xは定義済み")
}

出力結果

出力結果

xは未定義

Null型(Null)

Null型は空の値を意味するnullという値一種類のみです。nullは数値のコンテキストでは 0、真偽値のコンテキストではfalseとして振る舞います。

コンソールで確認しよう

var n = null;
console.log(n * 10);

出力結果

0

データ型の早見表

それぞれの型の特徴と値の例は下記になります。

{
	a : "...",
	b : "..."
};

new Object()

[0, 1, 2]

new Array()