概要

javascriptで明示的な型変換をする場合を試してみます。

明示的な型変換は以下の関数を使います。

Boolean()
Number()
String()
Object()

これらの関数をnew演算子を使わないで呼び出すと、明示的な型変換の動作をします。

簡単な例

次にサンプルコードを書きます。(便宜上consoleに出力しています)

//50
console.log(Number("50"));

//false
console.log(String(false));

//true
console.log(Boolean("60"));

//Number{5}
console.log(Object(5));

コメント部分はそれぞれコンソールに出力された値です。

オペランドと演算の関係

javascriptで、オペランド(被演算子)どうしの演算をする場合、動的な型変換が発生します。

例えば

文字列 + 数値

の場合は、片方の数値が文字列に変換されて、連結されます。

単項演算子の!を使う場合は、論理的に真偽を反転させる為、以下のようになります。

//false
console.log(!10);

//false
console.log(!true);

//true
console.log(!false);

意味の無い実験かもしれませんが、単項演算子!で真偽を反転させたものに、文字列を連結して出力すると、

//falsetest
console.log(!10 + "test");

//falsetest
console.log(!true + "test");

//truetest
console.log(!false + "test");

という結果になりました。

また、単項演算子!の真偽の反転は、2重につけることもできます。
試したところ、それぞれ以下のように出力されます。

//false
console.log(!!false);

//falsetest
console.log(!!false + "test");

Numberクラス

NumberクラスではtoString()メソッドがあります。

ある変数に数値を代入し、toString()メソッドを適用してみます。

この時、メソッドに記述する引数に注目します。
メソッドの引数は2進数から36進数まで、明示的に基数を指定することができます。

それぞれメソッド行末のコメントは実際の出力結果になります。

var test = 65;

//引数を指定しない場合、10進数
console.log(test.toString());       //文字列としての「65」を出力

//2進数として指定
console.log(test.toString(2));      //1000001

//4進数として指定
console.log(test.toString(4));      //1001

//8進数として指定
console.log(test.toString(8));      //101

//10進数として指定
console.log(test.toString(10));     //65

//16進数として指定
console.log(test.toString(16));     //41

//30進数として指定
console.log(test.toString(30));     //25

//36進数として指定
console.log(test.toString(36));     //1t

//(実験的に)37進数として指定
console.log(test.toString(37));

一番最後に実験的に37進数を指定すると

RangeError: radix must be an integer at least 2 and no greater than 36

というエラーになります。

Numberクラスのメソッド

また、Numberクラスには上の例(toString)の他、下記のメソッド(一例です)があります。

toLocalString
toFixed
toExponential
toPercision

詳しく調べていくと、Numberクラスのprototypeには以下のメソッドがあります。

Number.prototype.toExponential()
Number.prototype.toFixed()
Number.prototype.toLocaleString()
Number.prototype.toPrecision()
Number.prototype.toSource()
Number.prototype.toString()
Number.prototype.valueOf()

全てのメソッドの意味と実行結果を確かることはしませんが、全てprototype経由でコールされている点に注意が必要です。

いくつかサンプルを書いてみます。(console.logのコメント部はそれぞれ演算結果です)

//ランダムな数字を代入
var test = 2482704.5681;


//文字列に変換され、小数点は指定の桁数になる
//2482705
console.log(test.toFixed(0));

//2482704.568
console.log(test.toFixed(3));

//2482704.568100
console.log(test.toFixed(6));


//数値が指数表現に変換される
//2.5e+6
console.log(test.toExponential(1));

//2.4827e+6
console.log(test.toExponential(4));


//有効桁数が少ない場合、指数表現に変換される
//2.483e+6
console.log(test.toPrecision(4));

//2482704.6
console.log(test.toPrecision(8));

//2482704.568
console.log(test.toPrecision(10));

prototypeの概念は今回の投稿内容とは別の領域になるので、別途詳しく掘り下げます。
簡単にいうと、javascriptの全てのオブジェクトにはprototypeを継承していて、最小のテンプレートという考え方ができます。

また、Numberのグローバル関数としては、次のようなものが定義されています。

Number.isFinite()
Number.isInteger()
Number.isNaN()
Number.isSafeInteger()
Number.parseFloat()
Number.parseInt()

型変換の際に使う関数としては、parseIntとparseFloatになりますが、
parseIntは整数のみ解析できることに対し、
parseFloatは整数と浮動小数点数の両方を解析できます。

以下、簡単なサンプルを書いて試してみます。

var test = 2482704.5681;
console.log(parseInt(test));    //2482704

var test = "24827テスト";
console.log(parseInt(test));    //24827

var test = "24827テスト";
console.log(parseFloat(test));  //24827

var test = 248.4587;
console.log(parseInt(test));    //248

var test = -248.4587;
console.log(parseInt(test));    //-248

var test = 0xFF;
console.log(parseInt(test));    //255

var test = 0xff;
console.log(parseInt(test));    //255

var test = 0xFD;
console.log(parseInt(test));    //253

var test = "0.1";
console.log(parseInt(test));    //0

var test = "0.2";
console.log(parseInt(test));    //0

var test = ".2";
console.log(parseInt(test));    //NaN

var test = "abcd.2";
console.log(parseInt(test));    //NaN

var test = "abcd.3";
console.log(parseFloat(test));  //NaN

実行した結果、上記のようになります。
数値として解釈できない場合には、NaNという処理結果になります。