2014.05.04 [日] JavaScriptで文字列を数値にする。
あっという間に5月ゴールデンウィークです。久しぶりの更新になりますが、プロジェクト制作の途中で調べたことを書いておきます。
文字の大きさの設定には、単位が必要になります。
この数値をJavaScriptで取得したい場合、
試しに、
これは、12pxが文字列になっているために、数値のたし算演算ではなくなっているからです。+10に単位を加えて+10pxに変えてもたし算にはなりません。
単位を付けてfont-sizeの数値を変えることは簡単にできるのですが、例えば、PCサイトとスマホサイトだと数値で扱うと見た目が大きく変わってしまう場合など、割合（%）を掛けて扱えると便利です。
そこで、font-sizeの数値“12px”を数値のみの“12”を取得したいのです。
そんな時は、parseInt()（※整数のみ）もしくはparseFloat()（※小数点含む）を利用します。
また、日付や時間を解析するプログラムの場合、文字列の先頭に「0」が入ることがありますが、そのときparseInt()では、8進数と認識して変換されてしまいます。けっこうコレで嵌まることが多いので、parseInt(),parseFloat()を使うときは、常に第二引数で基数を設定するようにしましょう。
JavaScriptでparseIntする場合は基数を指定しようorz | 株式会社LIG
2014年5月19日追記
コメントで「parseIntで８進数は大昔の話です。ES5からなくなっています。」といただきました。調べてみると、確かにEcmaScript5の仕様から、parseIntで８進数の仕様が外されているようです。
参考：parseInt - JavaScript | MDN
ですがIE8はES5に準拠していませんの、対象ブラウザによっては基数を表記しておいたほうがいいかもしれません。
参考：JavaScriptCoreでparseInt('010')が十進数として処理されるように（→V8, SpiderMonkeyも追従）
文字の大きさの設定には、単位が必要になります。
hoge{
font-size: 10px; とか
font-size: 1.5em; とか
font-size: 115%;
} な感じに。この数値をJavaScriptで取得したい場合、
で簡単に取得できますがこの時、単位まで一緒に取得するので“文字列”となってしまいます。Text
試しに、
var pluse = element + 10;と書いて実行すると、Developer Toolsのコンソールには、“12px10”と表示されます。
console.log(pluse);
これは、12pxが文字列になっているために、数値のたし算演算ではなくなっているからです。+10に単位を加えて+10pxに変えてもたし算にはなりません。
単位を付けてfont-sizeの数値を変えることは簡単にできるのですが、例えば、PCサイトとスマホサイトだと数値で扱うと見た目が大きく変わってしまう場合など、割合（%）を掛けて扱えると便利です。
そこで、font-sizeの数値“12px”を数値のみの“12”を取得したいのです。
そんな時は、parseInt()（※整数のみ）もしくはparseFloat()（※小数点含む）を利用します。
var pluse2 = parseInt(element) * 0.5;で12×0.5の6がコンソールに表示されます。
console.log(pluse2);
また、日付や時間を解析するプログラムの場合、文字列の先頭に「0」が入ることがありますが、そのときparseInt()では、8進数と認識して変換されてしまいます。けっこうコレで嵌まることが多いので、parseInt(),parseFloat()を使うときは、常に第二引数で基数を設定するようにしましょう。
JavaScriptでparseIntする場合は基数を指定しようorz | 株式会社LIG
ということで、忘れないように備忘録しておきます。Text
2014年5月19日追記
コメントで「parseIntで８進数は大昔の話です。ES5からなくなっています。」といただきました。調べてみると、確かにEcmaScript5の仕様から、parseIntで８進数の仕様が外されているようです。
参考：parseInt - JavaScript | MDN
ですがIE8はES5に準拠していませんの、対象ブラウザによっては基数を表記しておいたほうがいいかもしれません。
参考：JavaScriptCoreでparseInt('010')が十進数として処理されるように（→V8, SpiderMonkeyも追従）
