как заменить функцию eval

Question

Подскажите плиз как в данном коде заменить функцию eval()

<!DOCTYPE html>
<html>

<head>
  <title>Калькулятор</title>
</head>
<style>
  body {
    background-color: green;
    user-select: none;
  }
  
  .container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 4px;
    background-color: aqua;
    padding: 5px;
    border-radius: 5px;
    max-width: 360px;
  }
  
  .item {
    background-color: magenta;
    color: #000;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    cursor: pointer;
    font-weight: bold;
  }
  
  form {
    max-width: 100%;
  }
  
  input {
    width: 355px;
    height: 60px;
    background-color: salmon;
    border: none;
    font-size: 30px;
    outline: none;
    text-align: right;
  }
  
  .input {
    grid-column: 1/-1;
    padding: 0;
  }
  
  .clean {
    grid-column: 1/3;
    background-color: gold;
  }
  
  .back {
    grid-column: 3/-1;
  }
  
  .equal {
    grid-column: 4;
    grid-row: 6/8;
  }
  
  .zero {
    grid-column: 1/3;
  }
</style>

<body>
  <div class="container">
    <div class="item input">
      <form name="form"><input type="text" name="textview" readonly></form>
    </div>
    <div class="item clean" onclick="clean()">C</div>
    <div class="item back" onclick="back()">&larr;</div>
    <div class="item" onclick="insert('+')">+</div>
    <div class="item" onclick="insert('-')">-</div>
    <div class="item" onclick="insert('*')">&times;</div>
    <div class="item" onclick="insert('/')">&divide;</div>
    <div class="item" onclick="insert('7')">7</div>
    <div class="item" onclick="insert('8')">8</div>
    <div class="item" onclick="insert('9')">9</div>
    <div class="item" onclick="insert('(')">(</div>
    <div class="item" onclick="insert('4')">4</div>
    <div class="item" onclick="insert('5')">5</div>
    <div class="item" onclick="insert('6')">6</div>
    <div class="item" onclick="insert(')')">)</div>
    <div class="item" onclick="insert('1')">1</div>
    <div class="item" onclick="insert('2')">2</div>
    <div class="item" onclick="insert('3')">3</div>
    <div class="item equal" onclick="equal()">=</div>
    <div class="item zero" onclick="insert('0')">0</div>
    <div class="item" onclick="insert('.')">.</div>
  </div>
  <script>
    function insert(num) {
      document.form.textview.value = document.form.textview.value + num;
    }

    function clean() {
      document.form.textview.value = "";
    }

    function back() {
      let exp = document.form.textview.value;
      document.form.textview.value = exp.substring(0, exp.length - 1);
    }

    function equal() {
      let exp = document.form.textview.value;
      if (exp) {
        document.form.textview.value = eval(exp);
      }
    }
  </script>
</body>

</html>

Answer 1

eval тут вообще не очень, поскольку не позволяет обнаруживать и исправлять ошибки например при выполнении --8 валится

по если вы сначала собираете строку, а потом ее уже пытаетесь выполнить, то можно написать свой парсер -

выискивать скобки,
все что в скобках обрабатывать как независимое выражение
выискивать умножить/делить и обрабатывать как независимые выражения
выискивать плюс/минус и выполнять операции

тогда можно будет и корректировать ошибки

или вы хотите малой кровью в одну команду все сделать?

БЛОГ НА HUSL

как заменить функцию eval

Ответы (1 шт):