使用闭包在 function 内部进行计数

Question

我试过了，它总是显示1次，出了点问题，如何解决这个问题？

    function myFunc() {

        var increment = (function() {
          var i = 0;
        
          return function() {
            i++;
            return i;
          };
        })();
        
        alert(`calling myFunc ${increment()} times`);

    }

Answer 1

任何时候你调用我的函数，它都会重新定义增量 function，所以你不应该期望它会说除1之外的任何内容。 您的问题是每次调用myFunc时都会定义增量

你想要做的是：

var i = 0;
function myFunc() {
    var increment = (function() {
        return function() {
            i++;
            return i;
        };
    })();
        
    alert(`calling myFunc ${increment()} times`);
}

所以现在i将在调用myFunc之间保留它的值。 它必须在myFunc之外。 或者您可以将整个 function 移到myFunc之外。

var increment = (function() {
    var i = 0;
        
    return function() {
        i++;
        return i;
    };
})();
function myFunc() {
    alert(`calling myFunc ${increment()} times`);
}

现在这有效：

console.log(increment()); // logs 1
console.log(increment()); // logs 2

Answer 2

问题是，当一个变量超出 scope 时，它会被销毁，下次调用一个值时，它将被重新创建，并以它开始的任何值初始化。 由于变量i被限定在increment function 内，而增量 function 本身的作用域是myFunc ，这意味着当myFunc关闭时，该闭包将在下一次运行 function 时创建。

一个例子显示i被提升到myFunc的 scope 和increment function 运行多次。

 function myFunc() { console.log('running myFunc'); var i = 0; console.log('assigning i to ' + i); function increment() { console.log('incrementing'); i++; }; increment(); increment(); console.log(`calling myFunc ${i} times`); } myFunc();

请注意， i现在在对increment的调用中维护其 state 。 现在当我们多次调用myFunc时，我们看到i被销毁，然后当myFunc再次运行时会创建一个新变量。

 function myFunc() { console.log('running myFunc'); var i = 0; console.log('assigning i to ' + i); function increment() { console.log('incrementing'); i++; } increment(); increment(); console.log(`calling myFunc ${i} times`); } myFunc(); myFunc();

现在，如果我们将i提升到myFunc的 scope 之上，我们将看到它的值在对myFunc的调用中保持在 scope 内。

 var i = 0; console.log('assigning i to ' + i); function myFunc() { console.log('running myFunc'); function increment() { console.log('incrementing'); i++; } increment(); console.log(`calling myFunc ${i} times`); } myFunc(); myFunc();

Answer 3

为我工作。

 var increment = (function() { var i = 0; return function() { i++; return i; }; })(); console.log(increment()); console.log(increment()); console.log(increment());