JavaScriptでの数値の抽出
関数 Number は数字のみで構成される文字列にしか
対応していません。
しかし、JavaScriptのプログラミングでは、
先頭に数字が続いて文字が来る文字列を扱う状況が
頻繁に発生します。
そのような文字列の例としては、ピクセル単位の値:
'12px' が挙げられます。先頭の数字だけを取り出し、
文字列部分を除去する必要があるとしましょう。
このような操作には parseInt 関数が存在します。
例でその動作を見てみましょう:
let num = parseInt('12px');
alert(num); // 12を表示
しかし、ピクセルは時々小数になることがあります:
'12.5px'。この場合、parseInt 関数は
対応できず、整数部分のみを表示します:
let num = parseInt('12.5px');
alert(num); // それでも12を表示
一般的に、この動作がまさに必要な場合もあるでしょう。
しかし、そうでない場合は、小数部分も含めて数値を
抽出する parseFloat 関数を使用してください:
let num = parseFloat('12.5px');
alert(num); // 12.5を表示
もちろん、小数部分がなくても parseFloat 関数は
正しく動作します:
let num = parseFloat('12px');
alert(num); // 12を表示
値が '5px' の変数と
値が '6px' の変数が与えられています。
これらの変数の値からピクセル数を合計し、
画面に表示してください。
値が '5.5px' の変数と
値が '6.25px' の変数が与えられています。
これらの変数の値からピクセル数を合計し、
画面に表示してください。
前の問題を修正して、表示される結果に
文字 'px' が追加されるようにしてください。
つまり、合計が 11.75 の場合、
画面には '11.75px' と表示されるようにします。