Javascript：正則表達式或其他控制只讀輸入的技術

Question

我正在創建“類似於Windows”的計算器。 我已經用html構建了計算器，並將輸入設置為只讀，類似於Windows。 現在，我知道您可以通過創建適當的正則表達式來控制基本輸入，但是只讀情況就是這樣嗎？

我想要的是我可以通過添加事件偵聽器來控制輸入框中的內容，而不是在滿足已經滿足的條件的情況下更新輸入，但是我可以使用正則表達式或其他適用於諸如3.55 *（4 /（1 + 1）） ？ 我希望我清楚自己需要什么。

我嘗試設置無數變量並使用if / switch語句控制它們，但最終還是起作用了，但是我花了大約100行代碼，很快就變成了控制的噩夢，所以我從頭開始，尋找替代方案，如果我了解到JS是真的，這是可能的。 請只使用純JS，不要使用其他庫。 這是我當前的JS代碼：

const domRef = {
  inputMain: document.getElementById('input-main'),
  inputSecondary: document.getElementById('input-secondary'),
  buttons: document.getElementById('calculator-basic').querySelectorAll('button')
}

function handleClick(event) {
  let target = event.target;

  if (target.classList.contains('expressions')) { // operands and operators
    let input = target.textContent;
    updateInputMain(input);
  }

}

function handleKeypress(event) {
  let target;
  for (let i = 0; i < domRef.buttons.length; i++) {

    if (domRef.buttons[i].textContent === event.key) {
      target = domRef.buttons[i];
      target.click();
    }

  }
}

function updateInputMain(input) {
  domRef.inputMain.value += input;
}



for (let i = 0; i < domRef.buttons.length; i++) {
  domRef.buttons[i].addEventListener('click', handleClick);
}

document.body.addEventListener('keypress', handleKeypress);

Answer 1

我建議使用專門的庫，例如Math.js

進行強大的計算變得如此簡單：

 math.sqrt(-4); // 2i console.log(math.eval(3.55*(4/(1+1)))); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/4.4.2/math.min.js"></script> 

Math.js包含一個math.parse函數， 用於將表達式解析為表達式樹。 那應該很方便。

另外，我們可以使用try-catch塊包裝parse或eval來檢查語法錯誤：

 try { math.parse('3.55*(4/(1+1)'); } catch(error) { console.error(error); } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/4.4.2/math.min.js"></script>