ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JS-执行机制

2022-07-01 12:33:58  阅读:132  来源: 互联网

标签:异步 console log JS 任务 机制 执行


JS执行机制

console.log(111)
setTimeout(function () {
    console.log(222)
},1000)
console.log(333)
// 输出结果:
111
333
222
-------------------------------------
console.log(111)
setTimeout(function () {
    console.log(222)
},0)
console.log(333) 
// 输出结果:
111
333
222

JS是单线程

单线程的特点:同一时间只能做一件事

影响:当多个任务需要执行时,所有任务都需要排队,前一个任务结束才能执行下一个任务。这样会导致:如果JS执行的时间过长,会造成页面的渲染不连贯,导致页面渲染加载阻塞的感觉。

同步和异步

为了解决这个问题,HTML5提出允许JS脚本创建多个线程的概念,于是JS出现了同步和异步。

同步

任务排队执行,前一个任务结束才会执行后一个任务。

异步

多个任务同时进行,比如:烧水做饭,异步的做法是:在烧水的10分钟的时间,同时去炒菜。

异步任务

常见的异步任务有以下三种类型:

​ 1.注册事件,如:click、resize等

​ 2.定时器,如:setInterval、setTimeout

​ 3.ajax(网络请求)

异步任务:添加到任务队列中(也称消息队列)

同步任务:在主线程中执行

JS执行机制(事件循环Event loop)

流程

​ 1.同步任务由JS的主线程依次执行

​ 2.异步任务委托给浏览器执行

​ 3.浏览器会将已完成条件的异步任务代码,加入任务队列等待执行

​ 4.一旦主线程中的同步任务执行完毕之后,系统就会按顺序读取任务队列中的异步任务,让异步任务进入主线程,再依次执行。
image

此时浏览器开启计时器,进行计时,当过去1秒后,浏览器判断异步任务已满足条件,将它推到任务队列中,等待主线程的任务执行完毕。

image

此时主线程同步任务执行完毕,系统会读取任务队列中的异步任务,将异步任务推到主线程去执行。

image

标签:异步,console,log,JS,任务,机制,执行
来源: https://www.cnblogs.com/jzhFlash/p/16434160.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有