javascriptで簡単な電卓を作ってみた（２）

前書き

前回は電卓のフロントエンド的な部分を作成したので、
今回は実際に処理をする部分をJavascriptで書いていきます。
といっても、今回で全部作るわけではなく（まだコードを途中までしか考えてない）
数字ボタンだけです。
なるべく早く他の機能も実装できるように、授業中に頑張って考えてきますｗ

コード書く

今回実装するのは数字入力だけなのでめちゃくちゃ簡単です。

var dispnum
function num(x) {
    dispNum=document.getElementById("disp").value;
    dispNum=dispNum*10+x;
    document.getElementById("disp").value=dispNum;
}

htmlにも変更を加えます

<input type="text" id="disp">

テキストボックスにdispというidを追加します。

説明

語彙力ない俺に説明できるかわかりませんが動作を解説します。

最初の行の
dispNum=document.getElementById("disp").value;
でjavascriptのdispNum変数をテキストボックスにある数値と同じにします。

次に
dispNum=dispNum*10+x;
でもとから入力されていた数値を十倍（繰り上がり）してから、
引数として渡された数値を加算する処理をしています。

最後に
document.getElementById("disp").value=dispNum;
でテキストボックスに表示されている内容を更新します。

次回に続きます。

まだ数字を入力できるようにしかなっていないので、
次回、計算処理をする部分のスクリプトを書きます。
明後日（金曜日）くらいには書けるかと思います。

今回のコードをcodepenというサイトに書いておいたので、
良かったら見てってください。
https://codepen.io/xtzi9859/pen/PoWROQv