JavaScript 型変換

1. JavaScriptの型変換

JavaScriptの変数は、以下の2つの方法で新しい変数や別のデータ型へ変換することができます。

• JavaScriptの関数（Function）を使用する
• JavaScript自体によって自動的（暗黙的）に行われる

2. 文字列から数値への変換

グローバルメソッドである Number() は、変数（または値）を数値に変換します。

• 「"3.14"」のような数値形式の文字列は、数値の 3.14 に変換されます。
• 空文字（""）は 0 に変換されます。
• 「"John"」のような非数値の文字列は、NaN（Not a Number：非数）に変換されます。

2.1 変換例

以下のケースは変換が可能です：

Number("3.14")    // 3.14 を返す
Number(Math.PI)   // 3.14159... を返す
Number(" ")       // 0 を返す
Number("")        // 0 を返す

以下のケースは変換できず、NaN になります：

Number("99 88")   // NaN を返す
Number("John")    // NaN を返す

2.2 数値メソッド（Number Methods）

文字列を数値に変換するために使用できる、その他のメソッドは以下の通りです。

2.3 単項プラス演算子（The Unary + Operator）

単項プラス演算子（+）を使用して、変数を数値に変換することも可能です。

let y = "5";      // y は文字列
let x = + y;      // x は数値

変数が変換できない場合、型は数値になりますが、値は NaN になります。

let y = "John";   // y は文字列
let x = + y;      // x は数値 (値は NaN)

3. 数値から文字列への変換

グローバルメソッド String() は、数値を文字列に変換できます。
リテラル、変数、式のいずれに対しても使用可能です。

String(x)         // 数値変数 x から文字列を返す
String(123)       // 数値リテラル 123 から文字列を返す
String(100 + 23)  // 式の結果から文字列を返す

数値メソッドの toString() も同様の動作をします。

x.toString()
(123).toString()
(100 + 23).toString()

3.1 その他のメソッド

数値を文字列に変換する際に、書式を指定できるメソッドが他にもあります。

4. 日付の変換

4.1 日付から数値への変換

グローバルメソッド Number() を使用して、日付（Date）を数値に変換できます。

d = new Date();
Number(d)          // 1404568027739 のようなタイムスタンプを返す

日付メソッドの getTime() も同様の結果を返します。

d = new Date();
d.getTime()        // 1404568027739 を返す

4.2 日付から文字列への変換

グローバルメソッド String() は、日付を文字列に変換します。

String(Date())     // "Thu Jul 17 2014..." のような文字列を返す

日付メソッドの toString() も同様です。

Date().toString()

その他、日付を細かく抽出するメソッドも利用可能です：
getDate(), getDay(), getFullYear(), getHours(), getMilliseconds(), getMinutes(), getMonth(), getSeconds(), getTime().

5. 論理値（Booleans）の変換

5.1 論理値から数値への変換

Number(false)     // 0 を返す
Number(true)      // 1 を返す

5.2 論理値から文字列への変換

String(false)      // "false" を返す
String(true)       // "true" を返す

// toString() メソッドも同様
false.toString()   // "false" を返す
true.toString()    // "true" を返す

6. 自動的な型変換（暗黙的型変換）

JavaScriptが「予期しない」データ型に対して操作を行おうとすると、値を「適切な」型へ自動的に変換しようとします。
結果は必ずしも期待通りになるとは限りません。

5 + null    // 5 を返す（null が 0 に変換されるため）
"5" + null  // "5null" を返す（null が "null" に変換されるため）
"5" + 2     // "52" を返す（2 が "2" に変換されるため）
"5" - 2     // 3 を返す（"5" が 5 に変換されるため）
"5" * "2"   // 10 を返す（"5" と "2" が数値に変換されるため）

6.1 自動的な文字列変換

オブジェクトや変数を出力しようとすると、JavaScriptは自動的にその変数の toString() 関数を呼び出します。

document.getElementById("demo").innerHTML = myVar;

// myVar = {name:"Fjohn"} の場合、"[object Object]" に変換
// myVar = [1,2,3,4] の場合、"1,2,3,4" に変換
// myVar = new Date() の場合、"Fri Jul 18 2014..." に変換

数値や論理値も同様に変換されます。

• myVar = 123 -> "123"
• myVar = true -> "true"
• myVar = false -> "false"

7. JavaScript 型変換テーブル

異なる値を数値、文字列、論理値へ変換した際の結果一覧です。