都说故事是有起因的,果然不假。因为今天公司的一道年终考试题 ………
对的没错,公司的年终考试,前后端都有
直接上题目,以下代码的输出顺序…..
//4. What will be written to the console for the following code snippet?
(function () {
console.log(1);
setTimeout(function () {
console.log(2);
}, 100);
console.log(3);
setTimeout(function () {
console.log(4);
}, 0);
console.log(5);
})()
在我的印象中,setTimeout,会是异步的吗……算是异步的吗,一顶点都不这样认为,很显示心里面想的是等延时完了,再输出.
oh,shit.
我给出的答案:
1,2,3,4,5
先不讨论这个API,直接看此结果,很明显直接挂分。回到pc上run一下,一看
正确的答案
1,3,5,4,2
马上就蒙蔽了,setTimeout它是异步的,异步的,然后赶紧确认是对setTimeout这个API,马上进行脑补
根据javascript高级程序设计和权威指南上面的说法,setTimeout(code,delay),delay是数字,单位是毫秒,code可以是函数或者是字符串,但是不推荐字符串,会影响性能;
如果以0毫秒的超时时间来调用setTimeout(),那么指定的函数不会立即执行,相反会把它放到队列中去,等到前面处于等待状态的事件处理程序全部执行完成后,再“立即”调用它。(setTimeout和setInterval经常有不守时的时候)。
如果code为字符串,相当于执行eval_r(),可以看做是function(){eval_r(字符串)};表现与code为函数时是一致的,只有在执行队列为空的时候才执行(已达到延迟时间);
结果来了,setTimeout并不是真正的异步操作,只是把想执行的代码放到UI队列中,在未来执行。另外所谓的事件循环,应该始终都在运行,不应该存在终止的情况,只不过在访问offsetWidth等位置属性时会促使浏览器刷新渲染队列,先执行reflow和repaint而已。此时事件循环不会中断把。
本文通过一道年终考试题探讨了setTimeout的执行顺序。通常认为setTimeout是异步的,但实际上它并不立即执行,而是将任务放入队列等待其他同步任务完成后调用。JavaScript高级程序设计和权威指南指出,setTimeout的延迟时间并不精确,且当延迟时间为0时,函数会在事件队列为空时执行。这表明setTimeout并非真正的异步操作,而是与事件循环和渲染队列的机制有关。

350

被折叠的 条评论
为什么被折叠?



