有这样一段代码:
function fn1(callback){setTimeout(function () {callback();}, 1000);}复制代码
这是一个异步编程的代码,刚开始的时候我一直绕不出来,何为异步?我想到了ajax的异步,但是还是没明白,查了很多讲解,越看越不明白,最后找到了任务队列和主线程,才明白了什么叫异步。
我们都知道JavaScript最大的特点就是单线程,单线程限制了任务必须排队,等待前面的任务执行完了才能下一个任务。这也叫同步,同步的意思就是必须等上一个任务执行完毕才能执行下一个任务。
alert(888);while (true){ alert(999);};alert(777);复制代码
在JavaScript线程中会先弹出888,然后一直循环弹出999,因为这个while一直占据着线程,777又必须等待上一个任务执行完毕,所以陷入了死循环,这就是同步。
同步就是这样,如果前一个任务耗时很长甚至是陷入循环,那么后一个任务不得不等着,于是一个任务队列的概念就出来了。比如我们在ajax操作的时候,我们不可能真的等请求回来了再执行另外的任务。
所以JavaScript把任务分成了两种,一种是同步任务,另一种是异步任务。同步任务就是在主线程上面排队执行,异步任务是不进入主线程,而是进入任务队列,当主线程从头到尾执行完毕之后,就会把任务队列的任务提到主线程,然后按同步任务的方式从头到尾执行。当再执行完毕之后,又会去任务队列再一次重复上面的操作,直到所有的任务执行完毕。
简单来说过程是这样的:
1、 主线程执行所有同步任务,形成一个执行栈;
2、 在主线程执行的过程中形成的异步任务,会进入任务队列;
3、 当执行栈中所有的同步任务队列执行完毕,任务队列自动进入执行栈,变成同步任务;再次期间形成的异步任务进入新的任务队列;
4、 主线程不断重复上面的步骤。
这就是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的执行原理有一定的理解。
欢迎关注Coding个人笔记 公众号