JavaScriptで電卓つくってみた

0





 

ソースコード

いつものことですが、JavaScriptのプロフェッショナルではないので参考程度でお願いしますw

なんかおかしいところがあればコメントで教えてください

<div id="calc">
<p id="value">0</p>
<button onclick="del()">&lt;</button>
<button onclick="c()">C</button>
<button onclick="ac()">AC</button>
<button onclick="push('/')">/</button>
<br>
<button onclick="push('7')">7</button>
<button onclick="push('8')">8</button>
<button onclick="push('9')">9</button>
<button onclick="push('*')">*</button>
<br>
<button onclick="push('4')">4</button>
<button onclick="push('5')">5</button>
<button onclick="push('6')">6</button>
<button onclick="push('-')">-</button>
<br>
<button onclick="push('1')">1</button>
<button onclick="push('2')">2</button>
<button onclick="push('3')">3</button>
<button onclick="push('+')">+</button>
<br>
<button onclick="push('0')">0</button>
<button onclick="push('00')">00</button>
<button onclick="push('.')">.</button>
<button onclick="eq()">=</button>
</div>
<script>
    var value = 0;
    var symbol = "";
    var buf = "";
    var do_clear = false;

    function push(str) {
        if(do_clear) {
            symbol = buf = "";
            do_clear = false;
        }
        if (str === '+' || str === '-' || str === '*' || str === '/') {
            if(buf) eq(true);
            symbol = str;
        }
        else {
            buf += str;
            document.getElementById('value').innerText = buf;
        }
    }

    function eq(do_clear_immediately = false) {
        if (symbol === "") {
            value = Number(buf);
        } else if (symbol === '+') {
            value += Number(buf);
        } else if (symbol === '-') {
            value -= Number(buf);
        } else if (symbol === '*') {
            value *= Number(buf);
        } else if (symbol === '/') {
            value /= Number(buf);
        }
        if(do_clear_immediately) symbol = buf = "";
        else do_clear = true;
        document.getElementById('value').innerText = String(value);
    }

    function del() {
        if(do_clear) {
            symbol = "";
            buf = String(value);
            do_clear = false;
        }
        buf = buf.substr(0, buf.length - 1);
        document.getElementById('value').innerText = buf ? buf : 0;
    }

    function c() {
        buf = "";
        document.getElementById('value').innerText = "0";
    }

    function ac() {
        value = 0;
        symbol = buf = "";
        document.getElementById('value').innerText = "0";
    }
</script>
<style>
    #value {
        font-size: 32px;
    }
    #calc button {
        width: 64px;
        height: 32px;
        margin: 2px;
    }
    #calc {
        border: 1px solid black;
        width: 320px;
        padding: 10px;
    }
</style>

 

 

“JavaScriptで電卓つくってみた” への2件のコメント

    1. 真面目な返答を求めてるのか面白い返しを求めてるのかよくわからんコメントありがとう

コメントを残す

メールアドレスが公開されることはありません。