背景
当我们忙于公司业务开发,习惯于control+c、control+v这种机械化操作时,我们将会离我们的理想越来越远。你可能会忘记或者疏于最基本,最底层的原理。在此,我们将一起踏上回头路,去探望我们遗失的美好。
之前在网上看了很多关于setTimeout,setinterval,promise等的文章,都能起到延迟执行的效果。但具体怎么执行,顺序怎样,讲解的都很片面,最近正好也被人问道,所以总结了一下以供大家参考。写的不好请留言多多指教,谢谢。
说起setTimeout,setinterval,promise等能够实现异步执行,我们必须先了解下JS的
事件循环
Event Loop,不管是前端、还是移动端(IOS和Android)等开发,都离不开事件循环机制,他会循环监听任务,并在适当的时机取出、执行和释放任务,更新UI等操作,更新UI渲染界面比较耗时,不同的渲染引擎有自己的一套渲染时机逻辑,决定要不要马上执行更新,毕竟更新UI成本大。
任务队列
宏任务:script(全局任务), setTimeout, setInterval, setImmediate, I/O, UI rendering.
微任务:process.nextTick, Promise.then, Object.observer, MutationObserver.
闭包
说起闭包,最明显的特点有三个,
1、函数套函数。
2、内部函数可以访问外部函数的变量。
3、局部变量,垃圾回收机制无法收回。
通过示例来查看执行顺序
输出结果
总结
1、js中为了防止线程阻塞,阻止全局代码的执行,衍生出很多异步执行解决方案,这些方案都会按需加载到指定的队列中,当全局队列执行完毕后,开始循环从 微队列->宏队列->微队列->宏队列...这种执行顺序执行下去。
2、当一个宏观队列执行完毕,立刻执行最近添加的微观队列。
3、这种逻辑也可以为首页加速带来思路。
在使用中有任何问题,欢迎留言反馈给我。书写不易,希望大家可以喜欢。