スポンサーリンク

【JavaScript】プログラミング授業案⑯【税込価格を計算】

calculatorCode

2年後には実際にプログラミングを授業の中で実施しなくてはなりません。
どんな授業を行うか、検証を兼ねて検討しています。
今回は、税込価格を表示してくれるシンプルな計算機(?)の制作です。

今回の学習成果

 <p id="output"></p>

prompt()シリーズ第2段です。

【JavaScript】プログラミング授業案⑬【名前を入力】
2年後には実際にプログラミングを授業の中で実施しなくてはなりません。授業案の13時間目。ユーザの入力に応答する基本プログラムです。

難易度をぐっと下げていますので、初期段階で扱える教材だと思います。
とはいえ、しれーっとfunctionを使っていたりしますが、特別何かというものでもないので、臆せず紹介してもいいと思います。

CSSの記述

前回に引き続き、今回もありません。
というか、やりようはいくらかあります。
今までが急ピッチでCSSまで書かせすぎていたのかもしれません。

JavaScriptの記述


functionで返ってきた値を計算します。
prompt()をparseInt()で囲ってあげて、文字列を整数に変換してあげることがポイントです。
あとはお馴染みになりつつあるtextContentでHTMLに書き込んであげます。
そろそろテンプレートリテラルを登場させると、より実務的でしょうか。
まぁ、高校の授業の教材研究ですので、そこはいいかなと思っています。

検討事項

もうちょっと改良すれば、税率を入力したり選んだりと考えられそうです。
そこまでいくと、税率計算機の完成ですね。
ただ、これは求められているものとはちょっと違うと思います。
プログラミングの導入時に、どんなことができるか体験するにはいいのではないでしょうか。

コメント

タイトルとURLをコピーしました