前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JavaScript异步

JavaScript异步

作者头像
wade
发布2020-04-23 17:19:54
4380
发布2020-04-23 17:19:54
举报
文章被收录于专栏:coding个人笔记coding个人笔记

有这样一段代码:

代码语言:javascript
复制
function fn1(callback){
setTimeout(function () {
callback();
}, 1000);
}

这是一个异步编程的代码,刚开始的时候我一直绕不出来,何为异步?我想到了ajax的异步,但是还是没明白,查了很多讲解,越看越不明白,最后找到了任务队列和主线程,才明白了什么叫异步。

我们都知道JavaScript最大的特点就是单线程,单线程限制了任务必须排队,等待前面的任务执行完了才能下一个任务。这也叫同步,同步的意思就是必须等上一个任务执行完毕才能执行下一个任务。

代码语言:javascript
复制
alert(888);
while (true){
    alert(999);
};
alert(777);

在JavaScript线程中会先弹出888,然后一直循环弹出999,因为这个while一直占据着线程,777又必须等待上一个任务执行完毕,所以陷入了死循环,这就是同步。

同步就是这样,如果前一个任务耗时很长甚至是陷入循环,那么后一个任务不得不等着,于是一个任务队列的概念就出来了。比如我们在ajax操作的时候,我们不可能真的等请求回来了再执行另外的任务。

所以JavaScript把任务分成了两种,一种是同步任务,另一种是异步任务。同步任务就是在主线程上面排队执行,异步任务是不进入主线程,而是进入任务队列,当主线程从头到尾执行完毕之后,就会把任务队列的任务提到主线程,然后按同步任务的方式从头到尾执行。当再执行完毕之后,又会去任务队列再一次重复上面的操作,直到所有的任务执行完毕。

简单来说过程是这样的:

1、 主线程执行所有同步任务,形成一个执行栈;

2、 在主线程执行的过程中形成的异步任务,会进入任务队列;

3、 当执行栈中所有的同步任务队列执行完毕,任务队列自动进入执行栈,变成同步任务;再次期间形成的异步任务进入新的任务队列;

4、 主线程不断重复上面的步骤。

这就是JavaScript的运行机制,如下代码:

代码语言:javascript
复制
console.log( "1" );
setTimeout(function() {
    console.log( "2" )
}, 0 );
setTimeout(function() {
    console.log( "3" )
}, 1000 );
setTimeout(function() {
    console.log( "4" )
}, 2000 );
setTimeout(function() {
    console.log( "5" )
}, 3000 );
console.log( "6" );
//1 6 2 3 4 5

每隔一秒就会有一个任务队列,主线程执行完毕就会把任务队列变成主线程执行,直到没有任务。

异步其实挺简单的,可能本人刚开始进入了误区,理解异步可以让我们对于JavaScript的执行原理有一定的理解。

(完)

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2018-08-19,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 coding个人笔记 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档