javascript - 尽管局部变量在变化，但全局变量的值没有变化

通过输入不同的值来更改全局变量currentLength的值。全局变量currentLength的值必须等于输入中的当前值。

输入数字120，alert应该有效，它无效，这意味着未重新定义全局变量的值。

function getCurrentLength() {
  let currentLength = 0;
  let output = document.getElementById('output');

  calcLength();

  function calcLength() {
    let total = +output.value;
    let len = document.getElementsByClassName('len');
    for (let i = 0; i < len.length; i++) {
      len[i].addEventListener('input', function() {
        let value = 0;
        currentLength = +len[i].value;
        for (let j = 0; j < len.length; j++) {
          let num = +len[j].value || 0;
          value += num;
        }
        output.value = total + value;
      })
    }
  }

  if (currentLength === 120) {
    alert(currentLength)
  }
}
getCurrentLength();

<input type="text" placeholder="length" class="len">
<input type="text" placeholder="length" class="len">
<input type="text" placeholder="length" class="len">
<input type="text" placeholder="length" class="len">
<input type="text" placeholder="length" class="len">
<input type="text" id="output" placeholder="output">

我期望currentLength的值为120，但对于进一步的全局操作，它的s all the time 0, be it alert or just using of currentLength`值却什么也没有。

最佳答案

原因很简单：调用currentLength === 120时只检查一次getCurrentLength，但是那时没有currentLength，因为currentLength仅在输入字段更改时设置。

将您的currentLength === 120检查更改为在事件处理程序中，那么您将获得预期的结果：

// ...
output.value = total + value;
if (currentLength === 120) {
    alert (currentLength);
}
// ...