if 语句中的 eval()答案

【问题标题】：Eval() in if statementif 语句中的 eval()
【发布时间】：2018-03-09 00:30:36
【问题描述】：

HTML & JS

<!DOCTYPE html>
<html>
  <head>
    <title>Calculator</title>
    <!-- Allows me to use jQuery -->
    <script>
    if (typeof module === 'object') {window.module = module; module = undefined;}
    </script>
    <script src="assets/libraries/jq.js"></script>
    <link rel="stylesheet" href="assets/css/style.css">
    <!-- End of "Allows me to use jQuery" -->
    <script>
    if (window.module) module = window.module;
  </script>
  </head>
  <body>
    <!-- "vysledek" means in English "result" -->
    <input id="vysledek" type="text" autofocus>
        <br>
                  <!-- "kalkulacka" means in my language "calculator" -->
      <button class="C" onClick="kalkulacka('C')">C</button>
      <button onClick="kalkulacka('(')">(</button>
      <button onClick="kalkulacka(')')">)</button>
      <button onClick="kalkulacka('/')">&#247;</button>
        <br>
      <button onClick="kalkulacka(7)">7</button>
      <button onClick="kalkulacka(8)">8</button>
      <button onClick="kalkulacka(9)">9</button>
      <button onClick="kalkulacka('*')">&#215;</button>
        <br>
      <button onClick="kalkulacka(4)">4</button>
      <button onClick="kalkulacka(5)">5</button>
      <button onClick="kalkulacka(6)">6</button>
      <button onClick="kalkulacka('-')">&#8722;</button>
        <br>
      <button onClick="kalkulacka(1)">1</button>
      <button onClick="kalkulacka(2)">2</button>
      <button onClick="kalkulacka(3)">3</button>
      <button onClick="kalkulacka('+')">&#43;</button>
        <br>
      <button onClick="kalkulacka('.')">,</button>
      <button onClick="kalkulacka(0)">0</button>
      <button onClick="kalkulacka('=')">=</button>
      <button onClick="kalkulacka('⌫')">⌫</button>
  </body>
</html>


<script>
// "boxik" here just represents that input field
const boxik = document.getElementById("vysledek");

function kalkulacka(x) {
  if (x == "C") {
    //This clears whole input
    boxik.value = "";
  } else if (x == "⌫") {
    //This removes last digit
    boxik.value = boxik.value.substring(0, boxik.value.length-1);
  } else if (x == "=") {
    //Here is our problem, I expect this to check if it was calculated or
    //not      
    if (eval(boxik.value)) {
      boxik.value = eval(boxik.value);
    } else {
      $("#vysledek").css("border-bottom", "2px solid #bd1515");
    }
  }
  //This basically adds all digits, + etc. together
  else {
    boxik.value += x;
  }
}
</script>

这里正在运行 JSFiddle：https://jsfiddle.net/mg7zmLos/7/

所以基本上今天我从 Electron 开始，我正在开发我刚刚硬编码的计算器应用程序，但它可以工作（到目前为止还没有完成）但我想检查我的计算是否成功，如果是，那么我只想做boxik.value = eval(boxik.value)，如果它拧紧然后使用 jQuery $("#vysledek").css("border-bottom", "2px solid #bd1515") 使我的边框变红，但我不知道如何检查它是否拧紧......

【问题讨论】：

我建议不要在if 中使用eval。如果等式计算为零，则不会显示。我还建议永远不要使用eval。
正如我所说，我正在使用 Electron 学习，我想为自己制作这个计算器，所以我想不会有任何问题。而且我忘了提到，如果我在那里写“5-”之类的东西，它会在控制台中给我这个错误：imgur.com/a/34VM3（“at kalkulacka”指的是 if (eval...) 和 HTMLButtonElement.click 错误指的是那个结果按钮 -
添加/删除类比离散样式值更好。 Eval 对于这样的事情很方便，但是您自己的解析器只支持您需要的语法会更好（并且需要很多更多的工作）。 ;-)

标签： javascript html electron eval calculator

【解决方案1】：

摆脱 if，而是像这样在 eval 周围放置一个 try/catch：

    try {
      boxik.value = eval(boxik.value);
      $("#vysledek").css("border-bottom", "2px solid #5faed0");
    }
    catch (e) {
      $("#vysledek").css("border-bottom", "2px solid #bd1515");
    }

【讨论】：

非常感谢！这绝对适用于那个 JSFiddle，但是当我在我的 Electron 程序中尝试它时，它会输出这个错误： Uncaught ReferenceError: kalkulacka is not defined at HTMLButtonElement.onclick (指的是我点击的特定按钮，我点击的每个按钮都一样 i>) 并且什么都不做，并且在开始时它也输出： Uncaught SyntaxError: Unexpected token { 的行
尝试输入我第一次输入时不小心漏掉的(e)。