javascript - JavaScript全局变量值在函数中丢失

我有一个很简单的问题。

我的operationVal的值在进入click事件时丢失，而if(operationVal == 0 )返回true。但是，如果我在事件之前检查operationVal，它具有选定的值。此外，如果我在事件中写operation.options[operation.selectedIndex].value而不是operationVal，则获取的值是正确的值。

如果有人向我解释了为什么，我将不胜感激。我假设它与JavaScript范围有关，但是对我来说这没有意义。

const firstNumber = document.getElementById('tbFirstNumber');
const secondNumber = document.getElementById('tbSecondNumber');
const operation = document.getElementById('ddlOperation');
const operationVal = operation.options[operation.selectedIndex].value;
const btn = document.getElementById('btnExecute');
const display = document.getElementById('display');

let result = '';

const regNumbers = /[0-9]{1,}/;

btn.addEventListener('click', function(argument) {
  if (regNumbers.test(firstNumber.value) && regNumbers.test(secondNumber.value)) {
    if (operationVal == 0) {
      alert(operationVal);
      result = 'Operation has not been chosen';
    } else {
      switch (operationVal) {
        case 'add':
          result = 'Result is: ' + (firstNumber.value + secondNumber.value);
          break;
        default:
          // statements_def
          break;
      }
    }
  } else {
    result = 'Number entry is not correct.';
  };

  display.innerHTML = result;
});

最佳答案

下一行：

operationVal = operation.options[operation.selectedIndex].value;

在执行此代码时获取选定的值，而不是在用户单击按钮时获取的值。

简单的解决方案是将这一行移动到事件侦听器回调函数中。