Question

function add() {
    var counter = 0;
    counter += 1;
    return counter
}

为什么计数器变量在第一次迭代后不会增加？输出始终为1。

Answer 1

add函数返回在函数counter内定义的变量add。变量counter的范围是函数的局部范围，这意味着每次调用函数时，它都会创建一个新变量counter，然后初始化为零，然后递增计数器。

如果您正在寻找计数器实现，那么每次都需要引用相同的counter变量并增加该变量。这可以通过使用闭包来实现。

示例：在下面的示例中，有2个函数，1个嵌套在另一个函数中。内部函数维护对外部函数Environment的引用，在这种情况下包含counter变量。因此，即使控件移出函数add，内部函数也会保留对counter变量的引用。

＆＃13;

var add = (function(){
  var counter = 0;
  return function(){
    return ++counter;
  }
})();

document
  .querySelector('#btn')
  .addEventListener('click', function(){
    document.querySelector('#output').textContent = add();
  });

＆＃13;

<div id="output">0</div>
<button id="btn">Increment</button>

＆＃13;

Answer 2

您可以使计数器成为全局变量，然后调用add函数：

function add(){  
  counter = counter + 1;
}

Answer 3

这是一个范围问题。将其更改为

let counter = 0;
function add() {
    counter += 1;
    return counter
}

或者，如果您希望能够执行add（），请使用嵌套函数

function adder() {
  let counter = 0;
  return function plus() {
    return counter += 1;
  };
}
let add = adder();
console.log(add());
console.log(add());
console.log(add());

函数范围变量是不可写的

3 个答案: