JS中的间歇(周期)调用setInterval()与超时(延迟)调用setTimeout()相关总结
超时调用需要使用window.setTimeout(code,millisec)方法
它接受两个参数:要执行的代码和以毫秒表示的时间(即在执行代码前需要等待多少毫秒)。其中第一个参数可以是一个包含JS代码的字符串(就和在eval()函数中使用的字符串一样),也可以是一个函数。第二个参数表示等待多长时间的毫秒数,但经过该事件后指定的代码不一定会执行。
这是因为JS是一个单线程序的解释器,一定时间内只能执行一段代码,为了控制要执行的代码就有一个JS任务队列,这些任务会按照将他们添加到队列的顺序执行。
setTimeout()的第二个参数告诉JS再过多长时间把当前任务添加到队列中。若队列为空,这段添加的代码会立即执行,若不为空,就要等前面的代码执行完再执行。
//不建议传递字符串!可能会导致性能损失
setimeout("alert('hellow world!')",1000);
//推荐以匿名函数调用方式
var timeoutId = setTimeout(function(){
alert("hellow world!");
},1000); clearTimeout(timeoutId);
调用setTimeout()之后,该方法会返回一个数值ID,ID是计划执行代码的唯一标示符,可以通过clearTimeout(ID)来取消未执行的超时调用.
setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
间歇调用的方法是setInterval(),接受的第一个参数是要调用的函数或要执行的代码串。,第二个参数是周期性执行或调用 code 之间的时间间隔,以毫秒计。
调用setInterval()方法同样会返回一个ID,该ID可用于在将来某个时刻取消间歇调用。取消间歇调用的重要性要远远高于取消超时调用,因为在不加干涉的情况下,间歇调用将会一直执行到页面卸载。
var num = 0,
max = 10,
intervalId = null;
function incrementNumber(){
num++;
if(num = = max){
clearInterval(intervalId);
alert("Done");
}
}
//以函数名调用方式
intervalId = setInterval(incrementNumber,500);
在开发环境中,很少使用真正的间歇调用,原因是后一个调用可能会在前一个调用结束之前启动(设置的周期时间millisec过短或函数代码code执行时间过长),所以最好不要使用间歇调用。
问题: JavaScript中setInterval传参常见的问题(setInterval第一个参数加引号与不加引号区别)
function fun() {
console.log("1");
}
setInterval("fun()",1000);//全局作用域下正常执行
setInterval(fun(),1000); //调用函数正常,setInterval调用出错
setInterval(fun,1000); //正确
setInterval(function(){ //匿名函数调用
console.log("1");
})
如例子中所示,setInterval 第一个参数 可以是函数名、匿名函数、函数的引用以及其他可执行代码。
setInterval("fun()",1000)
这种加引号的方式就可以理解为 可执行代码 就行eval() 一样去执行第一个参数,就是对fun方法的调用 理所当然的弹出 1 一秒钟间隔,一直执行。
setInterval(fun(),1000)
fun() 是对函数的直接调用,也就是说当setInterval还没有开始函数fun就执行了。如果这个函数没有返回值或者返回值不是可执行的函数或者其他的代码的话,就以上代码而言只是弹出一个1之后就停止了,这种方法无意义。
setInterval(fun,1000)
此时setInterval的第一个参数fun看作参数为 函数名或函数的引用。
我个人认为更推荐以匿名函数的方式调用最好。
JS中的间歇(周期)调用setInterval()与超时(延迟)调用setTimeout()相关总结的更多相关文章
- 熟悉JS中的常用选择器及属性、方法的调用
选择器.属性及方法调用的配合使用: <style> #a{ width: 200px; height: 1 ...
- js中setInterval与setTimeout用法
setTimeout 定义和用法: setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式. 语法: setTimeout(code,millisec) 参数: ...
- js中setInterval与setTimeout用法 实现实时刷新每秒刷新
setTimeout 定义和用法: setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式. 语法: setTimeout(code,millisec) 参数: ...
- JS中setInterval与setTimeout的区别
JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...
- JS里设定延时:js中SetInterval与setTimeout用法
js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操 ...
- js中setTimeout和setInterval的应用方法(转)
JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...
- 微信小程序首页index.js获取不到app.js中动态设置的globalData的原因以及解决方法
前段时间开发了一款微信小程序,运行了也几个月了,在index.js中的onLoad生命周期里获取app.js中onLaunch生命周期中在接口里动态设置的globalData一直没有问题,结果昨天就获 ...
- js 中关键字 this的用法
<1> js中this 的用法? (key:函数是由调用的,四种情况标红可知) (http://www.ruanyifeng.com/blog/2010/04/using_this_k ...
- JS中new到底发生了什么
outline prototype 与 __proto__ function 与 object new 到底发生了什么 prototype 与 __proto__ 首先说下在JS中比较容易让人困惑的 ...
随机推荐
- 往Android SDCard中读写入数据
一.用Environment (写) 1.API获取sdcard的路径 File path=Environment.getExternalStorageDirectory(); path=new Fi ...
- [.NET 4.5] ADO.NET / ASP.NET 使用 Async 和 Await 异步 存取数据库
此为文章备份,原文出处(我的网站) [.NET 4.5] ADO.NET / ASP.NET 使用 Async 和 Await 异步 存取数据库 http://www.dotblogs.com.tw ...
- JavaScrip拖动动画中的常见BUG
经常我们在用JS辛苦写完一个拖动效果之后 ,发现有各种无法用JS解决的BUG.比如拖动时DOM元素中的内容会变蓝,鼠标的指示会变为一个小+号,或disable的样式,通常这种情况一发生,我们的拖动效果 ...
- MvvmCross for WPF 支持子窗体显示、关闭、传参
最近在做 PCL(Portable Class Library)平台的项目,所以发一下自己遇到的问题 MvvmCross 是 PCL 平台的一个 MVVM 框架 地址:https://github.c ...
- angularjs+nodejs+mongodb三件套
说实话,自己对于web前段的认识并不是太深入,但是因为项目的需要,所以有的时候肯定会需要接触到web前段的知识点.说到web前端想必大家肯定会想到css+js+html,的确web前端的工作,从某总角 ...
- iOS开发的22个奇谲巧技
结合自身的实践开发经验总结出了22个iOS开发的小技巧,以非常欢乐的语调轻松解决开发过程中所遇到的各种苦逼难题,光读着便已忍俊不禁. 1. TableView不显示没内容的Cell怎么办? 类似于图1 ...
- 011--VS2013 C++ 斜角地图贴图
准备好的图片 //全局变量HDC mdc;HBITMAP fullmap;//声明位图对象,在初始化函数中完成的斜角地图会保存在这个位图中const int rows = 10, cols = 10; ...
- Vue2.0的通用组件
饿了么基于Vue2.0的通用组件开发之路(分享会记录) Element:一套通用组件库的开发之路 Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库. ...
- “我爱淘”冲刺阶段Scrum站立会议1
昨天是我们项目冲刺阶段的第一天,站立会议的内容如下: 1.昨天完成了项目中的第一个界面--“精选”界面:完成了一点Java文件的编写: 2.今天的任务就是完成第一个Activity的编写:将布局文件和 ...
- php7+apache的环境安装配置
因为刚开始接触php,所以要对php的开发环境进行搭建. 1.首先到Apache的官网下载最新版: http://httpd.apache.org/download.cgi: 参照该网址配置Apach ...