setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。
var timerId = setTimeout(func|code, delay)
判断以下代码的输出结果
var start=Date.now();
setTimeout(function(){
var end=Date.now();
console.log(end-start+'ms');
},2000);
console.log('1');
做一个猜测,JS引擎是按照代码块来顺序执行的,那么输出会是“延迟时间”>>"1"吗?结果却是相反的"1">>“延迟时间"
再做一个猜测,setTimeout里的代码输出之所以在后是因为它设置了将近两秒的延迟时间吗?如果setTimeout设置的延迟时间小于普通代码的运行时间,那么会不会先执行setTimeout里的代码呢?
var start=Date.now();
for (var i = 0; i < 30000; i++) {
console.log(1);
}
var end=Date.now();
console.log(''+end-start+'ms');
以上代码打印30000个1,运行用了将近4504ms
我们在上述代码前加入一个定时器
var start=Date.now();
setTimeout(function(){
var end=Date.now();
console.log(end-start+'ms');
},2000);
for (var i = 0; i < 30000; i++) {
console.log(1);
}
var end=Date.now();
console.log(''+end-start+'ms');
猜测:定时器设定的延迟时间为2000ms,小于普通代码运行时间,那么定时器中的代码是否会先输出呢?结果:虽然定时器设置的延迟时间小于普通代码的运行时间,执行结果仍然是先输出普通代码运行结果
定时器设置的延迟时间为2000ms,实际延迟了4597ms和普通代码的运行时间近乎相等,也可以说在普通代码运行结束后,定时器中的代码立刻执行。这是因为从它被载入到执行的时间超过了预设的2000ms,所以一遇到机会就尽快执行。
再做一个测试,把定时器和普通代码的位置调换
var start=Date.now();
for (var i = 0; i < 30000; i++) {
console.log(1);
}
var end=Date.now();
console.log(''+end-start+'ms');
setTimeout(function(){
var end=Date.now();
console.log(end-start+'ms');
},2000);
这次定时器里的代码在普通代码执行结束后,延迟将近两秒执行。可以说明定时器设定的延迟时间从它被载入的那一刻开始计算。
结论1:定时器里的代码遇到普通代码不论设定的延迟时间为多少,都得等普通代码统统执行结束,才执行。因此如果普通代码执行时间太久,定时器里的代码能不能执行是不确定的。
打个比喻:普通代码是主线,定时器是副线,规则是先把主线任务做完再来做副线任务。那么两个副线任务(定时器)相遇,先做哪个呢?是根据代码块顺序判断,还是延迟时间?
var start=Date.now();
setTimeout(function(){
var end=Date.now();
console.log('定时器1');
console.log(end-start+'ms');
},4000);
setTimeout(function(){
var end=Date.now();
console.log('定时器2');
console.log(end-start+'ms');
},2000);
代码块顺序定时器1在定时器2前面,执行结果:先输出定时器2再输出定时器1
结论2:两个副线任务(定时器)相遇,无论代码块顺序,延迟时间到了就执行
《《鄙人之粗见。。。。。多多指教