Question

停止函数运行

2019-08-12

52

javascript

各位：

我有以下代码：

let button = document.querySelector("#button");

function outer() {
  let counter = 0;
  return function() {
    counter ++;
    console.log(counter)
    if (counter === 5) {
      console.log("Five")
      return; 
    };
  }
}

let increase = outer();

button.addEventListener("click", increase);

我想询问用户是否要继续玩。如果答案是肯定的，计数器将设置为 0，游戏将重新开始；但是，如果答案是否定的，该函数将停止。问题是当计数器等于 5 时，该函数不会返回。为什么？

Answer 1

一旦 counter 变量的值达到五，您就必须移除点击监听器。

let button = document.querySelector("#button");

function outer() {
  let counter = 0;
  return function() {
    counter++;
    console.log(counter)
    if (counter === 5) {
      console.log("Five")
      button.removeEventListener("click", increase); /** remove the listener **/
    };
  }
}

let increase = outer();

button.addEventListener("click", increase);

<button id="button">click me</button>

Learn more about removeEventListener function.