LoginSignup
66
77

More than 5 years have passed since last update.

文字列から数値へ変換。文字列から数値だけを取り出す。

Last updated at Posted at 2014-12-09

数字だけの場合

parseIntはブラウザによっては先頭に0がついていると8進数になってしまうため、
第二引数に10を渡して、明示的に10進数に変換するようにしたほうが良いです。

var str = "-123.123";

//Numberを使う
Number(str); //-123.123

//+演算子(Numberと多分同じ)
+str; //-123.123

//parseInt
parseInt(str, 10); //-123

//parseFloat
parseFloat(str); //-123.123

後ろにpxなどが付いている場合

var str = "-123.123px";

//ダメな例
Number(str); //NaN
+str; //NaN

//良い例
parseInt(str, 10); //-123
parseFloat(str); //-123.123

前になにか付いている場合

滅多にないと思いますが一応


var str = "@-123.123";

//ダメな例
Number(str); //NaN
+str; //NaN
parseInt(str, 10); //NaN
parseFloat(str); //NaN

今までのやり方だと全滅していまいます。
正規表現を使って何とかします。

//-がいらない場合
var str2 = str.replace(/[^0-9^\.]/g,""); //"123.123"
//-が欲しい場合
var str3 = str.replace(/[^-^0-9^\.]/g,""); //"-123.123"

parseInt(str2, 10); //123
parseFloat(str2); //123.123

parseInt(str3, 10); //-123
parseFloat(str3); //-123.123

ちなみにこのやり方だと、数字以外の文字がどこにあってもできます。
(すべて結合されてしまいますが)

「.」が前に付いている場合

実は/[^0-9^\\.]/gだと「.」が残ってしまうので
"...123.123"みたいなときにNaNになってしまいます。
こんなケースは稀ですが、気になったので考えてみました。

var str = "<...(-123.123px)...>";
//-がいらない場合
var str2 = str.match(/\d+/g).join("."); //["123","123"].join(".")→"123.123"
//-が欲しい場合
var str3 = str.match(/-?\d+/g).join("."); //["-123","123"].join(".")→"-123.123"

Number(str2); //123.123
+str2; //123.123
parseInt(str2, 10); //123
parseFloat(str2); //123.123

Number(str3); //-123.123
+str3; //-123.123
parseInt(str3, 10); //-123
parseFloat(str3); //-123.123

このやり方は文字列の中に数字が一つの時だけ使えます。
ここまでできれば文字列から数値を取り出すのに困ることは、ほとんどないと思います。

なんでもイケるやり方

コメントにあったものから紹介させて頂きます。

var str = "098<123.123>-567.89____-1..123";

//-がいらない場合
var array = str.match(/[0-9]+\.?[0-9]*/g);
for(var i = 0; i < array.length; i++) {
  console.log(parseFloat(array[i]));
}
/*
98
123.123
567.89
1
123
*/

//-が欲しい場合
var array2 = str.match(/-?[0-9]+\.?[0-9]*/g);
for(var i = 0; i < array2.length; i++) {
  console.log(parseFloat(array2[i]));
}
/*
98
123.123
-567.89
-1
123
*/

66
77
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
66
77