JavaScript - Calculations(Paint Calculator)

Exercises for Programmers

開発環境

• OS X El Capitan - Apple (OS)
• Emacs (Text Editor)
• JavaScript (プログラミング言語)
• jQuery (Library)
• Safari(Web browser)

Exercises for Programmers: 57 Challenges to Develop Your Coding Skills (Brian P. Hogan 著、Pragmatic Bookshelf)のChapter 3(Calculations)、9(Paint Calculator)を取り組んでみる。

9(Paint Calculator)

コード(Emacs)

<p>
  You will need to purchase <span id="gallon0"></span> gallons of paint to
  cover <input id="area0" type="number" min="1" step="1" value="360"></input>
  squares feet.
</p>

<script src="sample9.js"></script>

(function () {
    var RATE = 350,
        span_gallon = document.querySelector('#gallon0'),
        input_area = document.querySelector('#area0'),
        calc,
        display;

    calc = function () {
        var area = parseInt(input_area.value, 10),
            gallon;

        gallon = Math.ceil(area / RATE);

        return gallon;
    };

    display = function () {
        span_gallon.innerText = calc();
    };

    display();

    input_area.onchange = display;
    input_area.onkeyup = display;
}());

You will need to purchase gallons of paint to cover squares feet.