JavaScript回调函数 setTimeout setInterval

回调函数

前面我们学习的函数中，函数的调用都是主动调用的，即使用函数名加括号来调用。除了主动调用函数外，还有一种机制是通过指针来调用，由调用者调用实现的。说的有点抽象，举个栗子。你和女朋友约完会送她回家，离别时，你肯定会说一句：到家之后给我发个消息，我很担心你。女朋友回家之后还真给你发了一条消息，这时候你就有戏了。其实这就是一个回调过程，你要求女朋友到家后发一条消息就是一个参数函数，而女朋友发的消息就是回调函数，回家的这个动作就是主函数。

调度器

有时我们并不想立即执行一个函数，而是等待特定一段时间之后再执行。这就是所谓的“计划调用（scheduling a call）”。

目前有两种方式可以实现：

• setTimeout 允许我们将函数推迟到一段时间间隔之后再执行。
• setInterval 允许我们重复运行一个函数，从一段时间间隔之后开始运行，之后以该时间间隔连续重复运行该函数。

这两个方法并不在 JavaScript 的规范中。但是大多数运行环境都有内建的调度程序，并且提供了这些方法。目前来讲，所有浏览器以及 Node.js 都支持这两个方法。

setTimeout

将函数推迟一段时间间隔之后再执行，语法 setTimeout(func|code, [delay], [arg1], [arg2], ...);

第一个参数是需要执行的函数，第二个参数是间隔时间，单位毫秒。后面的可选参数是要被传入的函数参数。

function myFun() {
    console.log("10s后输出的内容");
}
setTimeout(myFun,10000);//注意这里传入的是函数名，没有小括号

有参数的情况

function myFun(name) {
    console.log(name+" 5s后输出的内容");
}
setTimeout(myFun,5000,"Cherry");

setInterval

间隔一段时间后重复执行函数，语法和前一个函数相同，setInterval(func|code, [delay], [arg1], [arg2], ...);

function myFun(name) {
     console.log(name+" 每隔1秒输出的内容");
}
setInterval(myFun,1000,"Cherry");//这里传入的也是函数名，没有小括号

有参数的情况

function myFun(name) {
    console.log(name+" 每隔1秒输出的内容");
}
setInterval(myFun,1000,"Cherry");

嵌套的setTimeout

周期性调度有两种方式。一种是使用 setInterval，另外一种就是嵌套的 setTimeout。

function myFun() {
    console.log("每隔1秒输出的内容");
    setTimeout(myFun,1000);
}
setTimeout(myFun,1000);

输出顺序的数字

function myFun(i) {
    console.log(i);
    i++;
    setTimeout(myFun,1000,i)
}
setTimeout(myFun,1000,0);//输出1 2 3 4 5...