JavaScript线程

JavaScript是单线程的，因此在单个脚本运行过程中，会阻塞其它代码的执行和页面的渲染。

一个例子：

function f1() {
console.log("f1");
}
function f2() {
console.log("f2");
setTimeout(f1, 0);
}
function f3() {
console.log("f3");
}
for (var i = 0; i < 10; i++) {
f2();
}
f3();

结果：



f1最后执行，原因是浏览器把它加入到执行序列中，等到JS线程空闲时才会执行。

所以JS对DOM的操作也只有等到脚本执行完毕后才会在页面反应出来，所以setTimeout等定时函数就非常重要了，这是IFE的JS和树任务，要求将搜索过程以1s的间隔进行动画演示，最开始是直接在搜索到的条件判断里改变元素背景，但发现没有动画，因为在函数执行过程中无法渲染页面，后来将结果保存在数组里形成一个队列，然后用setTimeout间隔1s逐步执行数组的项，动画效果就有了，所以在编写动画效果时，要多多注意JS单线程特性。