clearInterval()如何清除setInterval()内部的timerID?

时间:2019-09-10 17:40:18

标签: javascript stack closures setinterval clearinterval

我是Java的新手,并且遇到了堆栈主题。在下面的代码中(为了集中于基础知识而不是语法,这很简单),我可以在函数表达式变量中清除timerID。这样做很普遍,但是我的问题是如何在这里制作堆栈?更清楚地说,事物的顺序如何继续清除清除器自身所处的变量?在clearInterval()之后如何调用“ console.log('DONE!')”?


function countNumbers(number){
  var timer = setInterval(function(){
    number++;
    if(number >= 10){
      clearInterval(timer);
      console.log('DONE!');
    }
    else {
      console.log(number);
    }

  },1000)
}

1 个答案:

答案 0 :(得分:1)

当内部函数在JavaScript中维护对外部函数变量的引用时,会形成 clousure ,即外部函数完成运行时不会破坏外部函数的成员因为它的变量仍在另一个函数中引用。

这是因为执行功能时,会为该功能的环境创建一个新的执行上下文。它维护一个作用域链,然后按执行顺序推入执行堆栈。

有一个全局执行上下文,然后调用countNumbers创建其自己的执行上下文,最后创建回调的执行上下文。回调函数执行上下文维护指向countNumbers函数执行上下文范围的指针,该指针维护指向全局变量的执行上下文的指针:

enter image description here

对于您来说,当setInterval()运行时,它立即/同步返回ID,并在timer变量中进行设置。由于timer变量是在countNumbers函数的作用域中定义的,因此内部/回调函数构成了对其的替代。回调的执行上下文可以通过作用域链访问并访问timer变量。

现在,当您运行setInterval时,回调将排队并以指定的间隔异步执行。由于较早形成的clousure,回调可以访问在外部函数范围中声明的timer变量,因此当number达到10时,可以使用外部函数范围中的ID值来取消时间间隔。

相关问题