お世話になります。
プログラミングを初めて1ヶ月弱の初学者です。
コードなど醜い部分が多数あると思いますがアドバイスなどいただけると幸いです。
ただいまJavascriptを勉強しています。
知識の定着のため今回電卓を作成しました。
計算機能を実装することはできたのですが、四則演算を繰り返し入力できないようにしたいのですがどう実装するかわかりません。
以下、今回のコードになります。
//(HTML) <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="main.css"> <title>電卓</title> </head> <body> <div class="container"> <input /><br> <div class="button"> <button onclick="number('7')" >7</button> <button onclick="number('8')" >8</button> <button onclick="number('9')" >9</button> <button onclick="number('+')" >+</button><br> <button onclick="number('4')" >4</button> <button onclick="number('5')" >5</button> <button onclick="number('6')" >6</button> <button onclick="number('-')" >-</button><br> <button onclick="number('1')" >1</button> <button onclick="number('2')" >2</button> <button onclick="number('3')" >3</button> <button onclick="number('*')" >*</button><br> <button onclick="number('0')" >0</button> <button onclick="number('00')" >00</button> <button onclick="number('.')" >.</button> <button onclick="number('/')" >/</button><br> </div> <div class="button-bottom"> <button onclick="update('') " >AC</button> <button onclick="cal()" >=</button> </div> </div> <script src="main.js"></script> </body></html> //(JS) function update(num) { document.querySelector('input').value = num; } function number(num){ document.querySelector('input').value += num; } function cal() { const calc = document.querySelector( 'input' ).value const total = new Function( 'return ' + calc ) if (total === '+' && '-' && '*' && '/' && '='){ //今回はこの部分に四則演算が続かないように記述しようとしていました。 } else { update(total().toString()); } }
if文内の記述もしっくりきていません。
拙い文章で申し訳ありませんがよろしくお願いいたします。
質問は編集できるので、投稿しなおす必要も削除依頼する必要はありません。
提示のコードではどういうふうに動くんでしょうか
何度も申し訳ありません。
新たに質問をあげ、修正依頼をしてしまいました。
以後気をつけます。
ご指摘いただきありがとうございました。
掲示のコードは現在修正中のものになります。
修正前のコードですが、下の方にある fanction cal() {} の部分のifがないものでした。
修正前のコードで出力してみて四則演算、数字の0が小数点を使わずに連続して入力できることに気がつき、今回if文を使い、四則演算などの連続入力ができないように実装したいと思いこちらに質問をしました。
number関数で、引数numが+-*/であった場合、input要素のvalue属性に既に+-*/が含まれていないことを調べてみてはどうでしょう?