Home > イヌでもわかるJavaScript講座 お品書き
イヌでもわかるJavaScript講座 お品書き へ戻ります
イヌでもわかるJavaScript講座


Step.72 - 燃費を計算


車の燃費を計算してみます。


Step テーマ
● eval - 計算式を求める

実行例


前回、満タンに入れたときの走行距離 
今回、満タンに入れたときの走行距離 
今回、入れたガソリン量  



リスト


<script type="text/javascript"><!--
function myCalc(){
myKyori = eval ( document.myForm.myAto.value + "-" + document.myForm.myMae.value );
myGas = eval ( document.myForm.myL.value );
myNenpi = Math.round( (myKyori / myGas) * 10 ) / 10;
alert( "燃費は " + myNenpi + "Km/L です" );
}
// --></script>
<form name="myForm">
前回、満タンに入れたときの走行距離 <input type="text" size="20" name="myMae"><br>
今回、満タンに入れたときの走行距離 <input type="text" size="20" name="myAto"><br>
今回、入れたガソリン量 <input type="text" size="11" name="myL"><br>
<input type="button" value="OK" onclick="myCalc()">
</form>


サンプルだけの HTMLは こちらへ

説明


[Q] ガソリンの燃費を計算できますか?
[A] うーん、算数は苦手なんですけど・・・

えーっと、燃費というと、1リッターで何キロメートル走るかですね・・。(^^;

えーっと、つまり、走行距離をガソリン使用量で割る・・だけですね。(^^;

あれ? ガソリン使用量って、どうやって、わかるの !?

とりあえず、満タンに入れたときに、走行距離を控えてもらって、次に満タン補給したときの走行距離と、そのときの補給量で、計算します。

よって、計算式は (おおげさ (^^; )、

(今回走行距離−前回走行距離) ÷ ガソリン補給量 の小数第2位を四捨五入でいきます。

うーん、123.456789 を 123.5 にするのは、小数第2位を四捨五入って言うんでしたっけ?(嗚呼、お馬鹿さん) (TvT)


さぁさぁ、本題にいきましょう。

欲しいデータは、前回満タンに入れたときの走行距離、今回満タンに入れたときの走行距離、今回入れたガソリン量の3つなので、フォームにて入力してもらいます。
すべて、入力すれば、[計算]ボタンを押して、先ほどの方程式で、答えを解きます。(^^;

さて、フォームに入力された値は数値であっても、文字の数字として、セットされています。
文字の数字を数値として扱う場合は、Step.30 の電卓で使った、eval 関数 を使うことにします。


● eval() 関数

myTotal = eval ( "1+2+3" );
というような、文字の計算式をパラメータで渡すと、数値の計算結果 を返してきます。
よって、myTotal には、数値の 6 がセットされます。

myTotal = eval ( "5" );
このような、計算式のない 数字 をパラメータで渡すと、
myTotal には、数値の 5 がセットされます。
eval() 関数は、数値変換にも使えるわけですね。


myKyori = eval ( document.myForm.myAto.value + "-" + document.myForm.myMae.value );
まず、myKyori に 走行距離 を計算しました。

myGas = eval ( document.myForm.myL.value );
ガソリン使用量を 数値 に変換しました。

myNenpi = Math.round( (myKyori / myGas) * 10 ) / 10;
Math.round() は、小数点以下を四捨五入する という関数です。

しかし、今回は 小数第1位まで求めたいのです。はい、上の式でピンときたでしょうか?

10 を掛けて、小数以下四捨五入して、10 で割る。うまくいきましたね。
123.456789 → 1234.56789 → 1235 → 123.5


 
イヌでもわかるJavaScript講座 お品書き へ戻ります