今日から少しずつ、今までの学習を基にプログラミングしたことを書いていきたいと思います。
今日は「BMI計算」をやってみたいと思います。
BMIとは
BMIはBody Mass Indexの略で、体重と身長から算出される肥満度を表す指数の事です。日本ではこの指数の「22」を標準体重としており、18.5以上25未満を「普通体重」としています。この範囲ならほぼ適正ということですね。BMIの算出方法は、
BMI = 体重 ÷ (身長(m)×身長(m))
となります。
プログラム
この計算式を元に私が作ったプログラムは次のようになりました。<html lang="ja"> <head> <meta charset="utf-8"> <title>BMI</title> </head> <body> <form name="bmitest"> 体重(kg)<br> <input type="text" id="wt"><br> 身長(cm)<br> <input type="text" id="ht"><br> BMI<br> <input type="text" id="bmi"><br> <input type="button" id="btn" value="start"> </form> <script> var obj = document.getElementById("btn"); obj.addEventListener("click",function() { var BodyWait = document.getElementById("wt").value; var Height = document.getElementById("ht").value; if(BodyWait === 0 || BodyWait === "") { alert("体重を入力してください"); return; } if(isNaN(BodyWait) === true) { alert("体重は数値を入力してください"); return; } if(Height === 0 || Height === "") { alert("身長を入力してください"); return; } if(isNaN(Height) === true) { alert("身長は数値を入力してください"); return; } var HeightMeter = Height / 100; var BMIResult = BodyWait / (HeightMeter * HeightMeter); document.getElementById("bmi").value = Math.round(BMIResult); },false); </script> </body> </html>
実際、実行してみると次のようになります。
初めてまともに動くJavaScriptのプログラムを書きました。かなり時間がかかってしまいました(汗)。
自分なりに気を付けたのは値のチェック部分。
if(BodyWait === 0 || BodyWait === "") { alert("体重を入力してください"); return; } if(isNaN(BodyWait === true) { alert("体重は数値を入力してください"); return; }
0又は空文字の場合、そして数値以外の場合はエラーメッセージを表示してプログラムから抜けるようにしています。この「プログラムから抜ける」処理が分からず、しばらく調べてしまいましたが、結局「return;」を使うことで解決しました。身長についても同様の処理を加えました。この部分がもう少し簡潔に書ければ良いなぁと思いますが現状どう書いてよいか分かりません。