数値への変換

広告

各値が数値へ変換される時にどのように変換されるのかをまとめます。

種類値数値
文字列"10"10
"ab"NaN
論理値true1
false0
nullnull0
グローバルプロパティundefinedNaN
オブジェクトobjobj.valueOf() 又は obj.toString()

値が数値に変換されるのは、例えば「-」や「*」演算子などで数値と演算を行った場合、対象の値は数値に自動的に変換されます。(「+」演算子の場合は異なりますので注意して下さい)。 

var num = 値 - 0;

上記のように、値から0を引く演算を行うと、対象の値は数値に変換されます。

文字列

文字列の場合、文字列が数字で構成された文字列(例えば"123"や"3.14"など)の場合は文字列が表す数値(例えば123や3.14)に変換されます。ただし16進数形式の場合は10進数の数値となり、指数表現の場合は小数点形式の数値となります。

数字ではない文字が含まれている文字列はNaNに変換されます。

論理値

論理値の場合はtrueは1に、falseは0に変換されます。

null

特殊な値であるnullは0に変換されます。

グローバルプロパティ

グローバルプロパティとして定義されているundefinedはNaNに変換されます。

オブジェクト

オブジェクトが数値に変換される時、まずオブジェクトに対してvalueOfメソッドを呼び出します。

valueOfメソッドはNumberクラスのオブジェクト、Stringクラスのオブジェクト、Booleanクラスのオブジェクトの場合は各クラスに対応した基本データ型の値を返します。それ以外の多くのクラスのオブジェクトに対しては、そのオブジェクトそのものを返します(Dateクラスのオブジェクトなどは数値を返します)。

基本データ型の値が返された場合は、その値を数値に変換します。オブジェクトそのものが返された場合、次にオブジェクトに対してtoStringメソッドを呼び出し文字列に変換した上でその文字列を数値に変換します。

多くのオブジェクトの場合は結果的にNaNに変換されますが、要素が1つだけで値として数値又は数字から構成される文字列が格納されている配列の場合はその格納されていた数値に変換されます。 

['ab'].toString()    --> "ab"    -->  NaN
[18, 29].toString()  --> "18,29" -->  NaN
[712].toString()     --> "712"   -->  712
サンプルコード

では簡単なサンプルで試してみます。 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>JavaScript テスト</title>
</head>
<body>

<script type="text/javascript" src="./js/script2_1.js">
</script>

</body>
</html>

document.write("<p>数値への変換</p>");

document.write("<p>");

document.write("10  -->  " + ("10" - 0) + "<br />");
document.write("3.13  -->  " + ("3.12" - 0) + "<br />");
document.write("0x1F  -->  " + ("0x1F" - 0) + "<br />");
document.write("1.2e-4  -->  " + ("1.2e-4" - 0) + "<br />");
document.write("8ab  -->  " + ("8ab" - 0) + "<br />");

document.write("true  -->  " + (true - 0) + "<br />");
document.write("false  -->  " + (false - 0) + "<br />");

document.write("null  -->  " + (null - 0) + "<br />");
document.write("undefined  -->  " + (undefined - 0) + "<br />");

document.write("{x:90, y:110}  -->  " + ({x:90, y:110} - 0) + "<br />");
document.write("['東京', '大阪']  -->  " + (["東京", "大阪"] - 0) + "<br />");
document.write("[94]  -->  " + ([94] - 0) + "<br />");
document.write("[94, 75]  -->  " + ([94, 75] - 0) + "<br />");
document.write("function(x){return x + 1;}  -->  " + (function(x){return x + 1;} - 0) + "<br />");
document.write("new Boolean(true)  -->  " + (new Boolean(true) - 0) + "<br />");
document.write("new Boolean(false)  -->  " + (new Boolean(false) - 0) + "<br />");
document.write("new Number(32)  -->  " + (new Number(32) - 0) + "<br />");
document.write("new String('772')  -->  " + (new String('772') - 0) + "<br />");
document.write("new String('bom')  -->  " + (new String('bom') - 0) + "<br />");

document.write("</p>");

上記を実際にブラウザ見てみると次のように表示されます。

p2-1

( Written by Tatsuo Ikura )