javascript - 在函数中保留变量

Question

我有一个计时器循环，我希望每三个循环执行一个操作，然后在第四个循环上执行另一个操作，然后重复自身。我认为下面的方法可行，但发现下次执行 MyLoop() 时未定义 counter 。如果我在全局命名空间中声明它，它将被定义，但是每个循环将不会有自己的计时器。如何在 MyLoop() 中保留 counter 值？

function MyLoop(t) {
  console.log(counter);
  if (typeof counter === 'undefined') {
    var counter = 0;
  }
  setTimeout(function() {
    if (counter >= 3) {
      console.log('MAIN: Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter = 0;
    } else {
      console.log('SUB:  Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter++
    }
    MyLoop(t);
  }, t * 1000);
}

MyLoop(2);
MyLoop(4);

Answer 1

演示该问题的非常小的样本:

function S(condition) { 
  var v; 
  if (condition) {v  = 42;} 
}
S(true);
S(false); 

您是否希望在第二次调用时将 v 设置为 42？可能不会，第二次调用 MyLoop 时也是如此。

您每次迭代都会重新创建闭包 - 而不是重新使用您首先调用的相同函数:

function MyLoop(t) {
  console.log(counter);
  if (typeof counter === 'undefined') {
    var counter = 0;
  }
  var onTick = function() {
    if (counter >= 3) {
      console.log('MAIN: Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter = 0;
    } else {
      console.log('SUB:  Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter++
    }
     setTimeout(onTick, t * 1000);
  };
  setTimeout(onTick, t * 1000);
}

或者，您可以使用正确的计数器重新创建函数:

function MyLoop(t, counter) {

 counter = counter || 0;

 setTimeout(function() {
    if (counter >= 3) {
      console.log('MAIN: Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter = 0;
    } else {
      console.log('SUB:  Counter: ' + counter + ' Loop ' + t + ' seconds.')
      counter++
    }
    MyLoop(t, counter); // creates new function with updated counter
  }, t * 1000);
}