THE HAM MEDIA BLOG

JavaScript:文字を数値に変換する方法(非参考版)

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
JavaScript
タグ:
文字
数値
eval
javascript

文字を数値に変換する方法

jQueryとかでCSSのpaddingとかを抜きだした時、
pxやemがついたまま抜きだされてくる。
これをreplace()などで数値だけにして足し算とかをしようとしても、
文字列として扱われてしまうことになる。

つまり、文字を数値へ変換しなければならないのだけど、
JavaScriptでどうやれば数値になるのか知らない。
調べたらたまに使っているeval()を使う事で、
文字を数値として使うことができるらしいので、
メモとしてエントリーしておく。

※文字列を数値とする場合はevelは利用しないように!!
本エントリーはJavaScriptを勉強する過程で書いた記事です。文字列を数値に変える場合、本エントリーのようなevelを利用するのではなく、次のエントリー「JavaScript:文字を数値に変換する方法その2」を参照し、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:文字を数値に変換する方法その2」でも書いたように、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

Posted by cyokodog at 2008年11月05日
>cyokodogさん
いつも教えていただきありがとうございます!
この次のエントリーにて、試してみました。
こっちの方が一気に数値として扱えるので、楽ですね。
勉強になりました!
Posted by ハム at 2008年11月06日
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

トップに戻る

×

この広告は1年以上新しい記事の投稿がないブログに表示されております。