前言：对定时器的小整理。
JS单线程
-
Javascript语言的执行环境是"单线程"（single thread）。也就是说，浏览器只分配给js一个主线程用来执行任务即函数，但是每次只能执行一个任务，只有等到当前任务执行完成后，才执行后面的任务，这些任务形成一个任务队列排队等候执行
-
为了避免因为某些长时间任务造成的无意义等待，JS引入了异步的概念，用另一个线程来管理异步任务。
-
同步任务直接在主线程队列中顺序执行，而异步任务会进入另一个任务队列，不会阻塞主线程。等到主线程队列空了（执行完了）的时候，就会去异步队列查询是否有可执行的异步任务了（异步任务通常进入异步队列之后还要等一些条件才能执行，如ajax请求、文件读写），如果某个异步任务可以执行了便加入主线程队列，以此循环。
JS定时器
定时器也是一种异步任务，通常浏览器都有一个独立的定时器模块，定时器的延迟时间就由定时器模块来管理，当某个定时器到了可执行状态，就会被加入主线程队列。
基本计时器
- setInterval() ：以指定时间为周期循环执行
- setTimeout(): 只在指定时间后执行一次
写法
- setInterval(expression,milliseconds)
- setTimeout(expression,milliseconds)
- 其中expression既可以是字符串，也可以是匿名函数，或者是一个函数名，milliseconds是延时或者重复执行的毫秒数
例子
setTimeout(function () {
console.log('timeout');
}, 1000);
setInterval(function () {
console.log('interval')
}, 1000);
// 输出一次 timeout，每隔1S输出一次 interval
清除定时器
- 定时器清除的方法：clearInterval(str)和clearTimeout(str)
- 定时器有个返回值，该数字代表定时器的序号，即第多少个定时器，我们获取其返回值后，调用clearInterval(返回值)或clearTimeout(返回值), 即可停止计时器
- 要清除定时器，就必须在用定时器的时候，定义一个变量来记录定时器的返回值
定时器的返回值：
var timer1=window.setTimeout(function(){
console.log("我是第一个定时器")
},1000);
console.log(timer1);//1
var timer2=window.setTimeout(function(){
console.log("我是第二个定时器")
},1000);
console.log(timer2);//2
清除定时器：
var id=window.setInterval("somefunction",10000);
//取消定时执行
window.clearInterval(id);
id=null;
注意：
- setTimeout虽然只执行一次，但执行后，定时器还在，只是没用了而已
- 定时器即使清除了，其返回值也不会清除，之后设置的定时器的返回值也会在其返回值的基础上继续向后排
- 一般清空定时器后会将清空的定时器的变量置空，这样写既可以释放内存，也可以便于后边代码的判断。
定时器传递参数
先看一下定时器的常用写法：
- 函数名，不带参数
setInterval(test,1000)； //1秒后执行- 字符串，可以执行的代码
setInterval('test()',1000)； //1秒后执行- 匿名函数
setInterval(function(){},1000)； //1秒后执行- 调用函数
setInterval(test(),1000)； //立即执行
在使用函数名作为调用句柄时都不能带参数，而在许多场合必须要带参数
函数hello
var userName="jack";
//根据用户名显示欢迎信息
function hello(_name){
alert("hello,"+_name);
}
window.setTimeout(hello(userName),3000);//会立即执行，不是等3秒后执行
修改：
window.setTimeout("hello(userName)",3000);
注：其他方法见
异步之定时器
setTimeout为例：
setTimeout(function(){
console.log(0);
},0)
console.log(1);
// 1
// 0
- 大家可能疑问了，setTimeout中设置的推迟执行的毫秒数是0呀，不就是立即执行的意思吗。实际在执行程序的时候，浏览器会默认setTimeout以及ajax请求这一类的方法都是耗时程序（尽管可能不耗时）,所以此时的setTimeout尽管它推迟时间为0，但是js不会立即执行，而是把它加入任务队列，当执行完执行栈的同步任务也就是打印1后，再执行setTimeout的回调函数，打印0。
- 总之，setTimeout(fn,0)的含义是，指定某个任务在主线程最早可得的空闲时间执行，也就是说，尽可能早得执行。它在"任务队列"的尾部添加一个事件，因此要等到同步任务和"任务队列"现有的事件都处理完，才会得到执行。
- 所以注意的是，setTimeout()只是将事件插入了任务队列，必须等到当前代码（执行栈）执行完，主线程才会去执行它指定的回调函数。但如果当前任务十分耗时，需要等很久，所以并没有办法保证，回调函数一定会在setTimeout()指定的时间执行，比如说你指定10ms后执行，但是当前的任务执行了20ms，所以setTimeout的回调函数并不能在10ms后立即执行，可能要20ms后，如果setTimeout在任务队列中不是排第一位，可能还不止20ms。
网友评论