JavaScript：文字を数値に変換する方法（非参考版）
jQueryとかでCSSのpaddingとかを抜きだした時、
pxやemがついたまま抜きだされてくる。
これをreplace()などで数値だけにして足し算とかをしようとしても、
文字列として扱われてしまうことになる。
つまり、文字を数値へ変換しなければならないのだけど、
JavaScriptでどうやれば数値になるのか知らない。
調べたらたまに使っているeval()を使う事で、
文字を数値として使うことができるらしいので、
メモとしてエントリーしておく。
本エントリーはJavaScriptを勉強する過程で書いた記事です。文字列を数値に変える場合、本エントリーのようなevelを利用するのではなく、次のエントリー「JavaScript：文字を数値に変換する方法その２」を参照し、parseInt()やparseFloat()を利用するようにしてください。
サンプル
いろいろな変数を作って、それぞれを足してみます。
変数の値がそれぞれ下記の時
var test01 = 10; //数値
var test02 = '10'; //文字
var test03 = '10px'; //文字(pxを含む)
var test04 = test03.replace('px',''); //test03からpxを抜き取ったもの
var test05 = eval(test04); //test04を数値に変換
その結果は・・・
- test01 + test01 =
- test02 + test02 =
- test03 + test03 =
- test04 + test04 =
- test05 + test05 =
- test01 + test02 =
- test01 + test04 =
- test01 + test05 =
数値＋数値は合計数値がでていますが、
どちらか片方にでも文字が入っていると、文字同士がつなげられる結果になるようです。
eval()にしたtest05は文字のままのtest04とはちがい、
数値に変換されているので、合計も数値になっています。
eval()の使い方、覚えておかないと。。。
※文字列を数値とする場合はevelは利用しないように！！文字列を数値に変える場合、evelを利用するのではなく、「JavaScript：文字を数値に変換する方法その２」でも書いたように、parseInt()やparseFloat()を利用するようにしてください。
参考サイト：
//小数点以下切捨て
alert(parseInt("12.5px")) //12
alert(parseInt("12.5px")+100) //112
//小数点以下も有効
alert(parseFloat("12.5px")) //12.5
alert(parseFloat("12.5px")+100) //112.5
いつも教えていただきありがとうございます！
この次のエントリーにて、試してみました。
こっちの方が一気に数値として扱えるので、楽ですね。
勉強になりました！