概要
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という処理結果になります。