递归调用setTimeout函数并传递一个匿名函数
Calling the setTimeout Function recursively and passing an anonymous function
我对这种语法的区别感到困惑:
var timerId;
function clockStart(){
// debugger;
if(timerId){
return;
}
update();
// THIS LINE BELOW *********************************************
var timerId = setTimeout(function(){clockStart()}, 1000);
}
function clockStop(){
timerId = null;
}
function update(){
var date = new Date();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
if(hours < 10) {
hours = '0'+hours;
}
document.getElementById('hour').innerHTML = hours;
if(minutes < 10){
minutes = 0+minutes;
}
document.getElementById('min').innerHTML = minutes;
if(seconds < 10){
seconds = '0' + seconds;
}
document.getElementById('sec').innerHTML = seconds;
}
我提供了两个被调用的函数,但是这个函数的主要部分我不理解的是为什么我需要传递一个匿名函数来调用我的clockStart()函数。
我的函数工作时,我使用这个语法:
var timerId = setTimeout(function(){clockStart()}, 1000);
但是当我使用:
时它不起作用 var timerId = setTimeout(clockStart(), 1000);
我已经在这两个函数上工作了一段时间,老实说,我是偶然发现的。除了调用clockStart函数外,我真的看不出匿名函数在做什么。但是在我看来,我的clockStart()函数应该每秒(1000ms)调用一次,因为它正在调用自己,那么为什么它需要一个匿名函数来调用它呢?它不应该调用自己吗?
如果你想看到这个数字'时钟'的完整代码,请检查我的codepen链接。
这一行:
var timerId = setTimeout(clockStart(), 1000);
立即调用clockStart()
并将该函数的返回结果传递给setTimeout()
。由于该函数不返回任何内容,因此您实际上是这样做的:
clockStart();
var timerId = setTimeout(undefined, 1000);
这显然不是你想要的。
你可以这样写:
var timerId = setTimeout(clockStart, 1000);
在这种情况下,你想传递一个函数引用到setTimeout()
,这意味着你不包括父元素。当您包含父类时,这意味着立即执行它。当您只是传递函数的名称时,这只是对函数的引用(将其视为句柄),setTimeout()
可以稍后调用它。这就是你想要的。
当你这样做的时候:
var timerId = setTimeout(function(){clockStart()}, 1000)
你只是定义了一个匿名函数,并将对该匿名函数的引用传递给setTimeout()
,这很好,但在这种情况下不是必需的,因为你可以像上面的第三个代码示例一样只传递clockStart
的名称。
既然你在后面问了一个函数如何调用一些东西,我将给你看一个简单的例子。这个函数有一个起始值,一个结束值,一个增量和一个回调函数。这将调用回调函数,并将递增的值传递给它,直到该值超过结束值。
// define an increment function that will call a callback
// multiple times based on the start, end and increment arguments
function eachIncrement(start, end, increment, callback) {
// the function argument named callback contains
// a function reference
var val = start;
while (val <= end) {
// execute the function reference and
// pass it the current val
callback(val);
val += increment;
}
}
// define a function that we want to be called later
function processValues(num) {
// this will get called multiple times with
// values 1, 4, 7, 10
}
// set up the increment parameters and pass a function reference
eachIncrement(1, 10, 3, processValues);
- 创建一个类似链接的按钮,并通过Javascript函数打开一个新的弹出窗口
- 我可以在json对象中添加一个函数吗
- Javascript使函数一个接一个地执行
- 是JavaScript中的函数一个对象
- 两个几乎相等的jQuery函数;一个适用于IE,一个不适用于IE
- 两个Javascript函数一个window.onload=Custom.init;和一个window.onload=f
- 使javascript加载函数一个接一个地执行
- 如何通过两个嵌套的匿名函数(一个带有超时的事件处理程序)传递变量
- 为什么我不能让两个jQuery函数一个在另一个里面呢?
- 给函数一个变量名,而不是它的值
- 如何使用嵌入函数(一个滚动页由Pete - peachananr)
- 是否有可能给JavaScript函数一个类型/类?
- 确保两个函数一个接一个地执行,其中第一个函数内部有一个异步调用
- 两个不同的ajax函数一个接一个调用返回相同的值
- jQuery第一次更改函数一个工作
- 给这个函数一个id
- 如何给回调函数一个值一个变量在特定时刻
- 使用回调使两个函数一个接一个地运行
- 两个函数(一个用php)是否可以用“;onclick”;
- 两个几乎相同的函数.一个函数用Queue进行排队.Jquery效果在queued函数上不起作用.为什么