前端开发那些事儿JavaScript入门教程前端入门教程

JavaScript回调函数 setTimeout setInt

2021-08-07  本文已影响0人  微语博客

回调函数

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

回调函数就是传递一个参数化的函数,就是将这个函数作为一个参数传到另一个主函数里面,当那一个主函数执行完之后,再执行传进去的作为参数的函数。走这个过程的参数化的函数 就叫做回调函数。换个说法也就是被作为参数传递到另一个函数(主函数)的那个函数就叫做 回调函数

调度器

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

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

这两个方法并不在 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...
上一篇下一篇

猜你喜欢

热点阅读