js 電卓の計算とボタン

Question

現在、JSで電卓を作っています
現状の問題点が３つあります
１.最初の時に００を押したら、０００のように続かないコードを書いたら、数字をいれた後に００を押すと反応しなくなってしまいました。
2. 計算する時に＋、ーは機能するのに×、÷が反応しないという問題も出てきました。
3. 演算子が連続で出てきてしまうということです。

var origin = ""; //表示している値（元々ある値）


//ボタンを押した時
var elem1 = document.getElementById("1")
elem1.addEventListener("click",function(){
  console.log("1")
  number("1")
})
var elem2 = document.getElementById("2")
elem2.addEventListener("click",function(){
  console.log("2")
  number("2")
})
var elem3 = document.getElementById("3")
elem3.addEventListener("click",function(){
  console.log("3")
  number("3")
})
var elem4 = document.getElementById("4")
elem4.addEventListener("click",function(){
  console.log("4")
  number("4")
})
var elem5 = document.getElementById("5")
elem5.addEventListener("click",function(){
  console.log("5")
  number("5")
})
var elem6 = document.getElementById("6")
elem6.addEventListener("click",function(){
  console.log("6")
  number("6")
})
var elem7 = document.getElementById("7")
elem7.addEventListener("click",function(){
  console.log("7")
  number("7")
})
var elem8 = document.getElementById("8")
elem8.addEventListener("click",function(){
  console.log("8")
  number("8")
})
var elem9 = document.getElementById("9")
elem9.addEventListener("click",function(){
  console.log("9")
  number("9")
})
var elem11 = document.getElementById("/")
elem11.addEventListener("click",function(){
  console.log("/")
  number("÷")
})
var elem12 = document.getElementById("*")
elem12.addEventListener("click",function(){
  console.log("*")
  number("×")
})
var elem13 = document.getElementById("-")
elem13.addEventListener("click",function(){
  console.log("-")
  number("-")
})
var elem14 = document.getElementById("+")
elem14.addEventListener("click",function(){
  console.log("+")
  number("+")
})
//   clearを押した時
var elem10 = document.getElementById("clear")
elem10.addEventListener("click",function(){
  console.log("clear")
  var number = document.getElementById("result_display")
  number.innerHTML = "0";
  origin = "";
})
//     ＝を押した時
var elem15 = document.getElementById("=")
elem15.addEventListener("click",function(){
  console.log("=")
  var number = document.getElementById("result_display")
  number.innerHTML = calc_func(origin);
})
//     00を押した時
var elem17 = document.getElementById("00")
elem17.addEventListener("click",function(){
  console.log("00")
  var i = document.getElementById("result_display")
// originは電卓の計算するところにある数字(クリックした数字)  //＝＝＝
// originに何か数字がはいっている
if(origin === "0"){
    console.log("bbb")
    var number = document.getElementById("result_display")
    number.innerHTML = origin + "00";
    origin = origin + "00";
  // originに何も数字がはいっていない。
  }else if(origin === ""){
    console.log("ccc")
    var number = document.getElementById("result_display")
    number.innerHTML = "0"
  }
  })
  //    0を押した時
var elem16 = document.getElementById("0")
elem16.addEventListener("click",function(){
  console.log("0")
  var i = document.getElementById("result_display")
  if(!isNaN(i)){
    console.log("eee")
    var number = document.getElementById("result_display")
    number.innerHTML = origin + "0";
    origin = origin + "0";
  }else if(origin === ""){
    console.log("fff")
    var number = document.getElementById("result_display")
    number.innerHTML = "0"
  }
})


var result = document.getElementById("resutl_display")

//数字、記号の表示
function number(num1){
  var number = document.getElementById("result_display")
  number.innerHTML = origin + num1;
  origin = origin + num1;
}

Comments

[yambejp]

まずはどうしたいか仕様をまとめるところから始めてください（要求定義）

Answer 1

１.最初の時に００を押したら、０００のように続かないコードを書いたら、数字をいれた後に００を押すと反応しなくなってしまいました。

// originに何か数字がはいっている
if (origin === "0") {
  ...
// originに何も数字がはいっていない。
} else if (origin === "") {
 ...
}

現状、こんなコードになってますが、origin が "0" の1文字でも空でもないときは何もしないコードになってます。ここで判定すべきは、「origin の最後の文字が0〜9のどれか」じゃないでしょうか。

1. 計算する時に＋、ーは機能するのに×、÷が反応しないという問題も出てきました。

origin に × ÷ を追加していますが、JavaScriptの式では掛け算割り算は * と / です。

1. 演算子が連続で出てきてしまうということです。

そうですか。どうしたいのですか。