Found a issue in the 8h.html (Undefined value is stored after hitting the '=' button)

ZanZubair96 commented 2 months ago

Step-1: Clicking on the clear button (The value is empty now) Step-2: Clicking on the '=' button (The value stored in the localStorage is undefined)

due to which the below issue appears

Schemper commented 2 months ago

Can you share your code so we can take a look at it properly.

ZanZubair96 commented 2 months ago

<!DOCTYPE html>
<html>
  <head></head>
  <body>
    <p class="js-display-calc"></p>
    <p>
      <button onclick="
        updateCalculation('1');
      ">1</button>

      <button onclick="
        updateCalculation('2');
      ">2</button>

      <button onclick="
        updateCalculation('3');
      ">3</button>

      <button onclick="
        updateCalculation(' + ');
      ">+</button>
    </p>

    <p>
      <button onclick="
        updateCalculation('4');
      ">4</button>

      <button onclick="
        updateCalculation('5');
      ">5</button>

      <button onclick="
        updateCalculation('6');
      ">6</button>

      <button onclick="
        updateCalculation(' - ');
      ">-</button>
    </p>

    <p>
      <button onclick="
        updateCalculation('7');
      ">7</button>

      <button onclick="
        updateCalculation('8');
      ">8</button>

      <button onclick="
        updateCalculation('9');
      ">9</button>

      <button onclick="
        updateCalculation(' * ');
      ">*</button>
    </p>

    <p>
      <button onclick="
        updateCalculation('0');
      ">0</button>

      <button onclick="
        updateCalculation('.');
      ">.</button>

      <button onclick="
        // Note: eval() takes a string and runs it as code.
        // Avoid using eval() in real world projects since
        // it can potentially be given harmful code to run.
        // Only use eval() for learning purposes.
        calculation = eval(calculation);
        console.log(calculation);

        // Remember to save the calculation here.
        localStorage.setItem('calculation', calculation);
        document.querySelector('.js-display-calc').innerHTML = calculation;
      ">=</button>

      <button onclick="
        updateCalculation(' / ');
      ">/</button>
    </p>

    <p>
      <button onclick="
        calculation = '';
        console.log(calculation);

        // Remember to save the calculation here.
        localStorage.setItem('calculation', calculation);
      ">Clear</button>
    </p>

    <script>
      let calculation = localStorage.getItem('calculation') || '';

      function updateCalculation(value) {
        calculation += value;
        console.log(calculation);
        localStorage.setItem('calculation', calculation);
        document.querySelector('.js-display-calc').innerHTML = calculation;
      }

      // Optional: you can also create a function in order
      // to reuse this code.
      function saveCalculation() {
        localStorage.setItem('calculation', calculation);
      }
    </script>
  </body>
</html>

Note It is the same code, available in this repo 8h.html

SuperSimpleDev / javascript-course

Found a issue in the 8h.html (Undefined value is stored after hitting the '=' button) #134