异步操作

async function async1(){
console.log('async1 start');
await async2();
console.log('async1 end');
}
async function async2(){
console.log('async2');
}
console.log('script start');
setTimeout(function(){
console.log('setTimeout');
},0)
async1();
new Promise(function(resolve){
console.log('promise1');
resolve();
}).then(function(){
console.log('promise2')
})
console.log('script end');
执行顺序是:script start -> async1 start -> async2 -> promise1 -> script end -> promise2 -> async1 end -> setTimeout
 
 这题主要是考察事件循环中函数执行顺序的问题,分别有async,await,setTimeout,Promise
 
JS分为同步任务和异步任务,同步任务都在主线程上执行形成一个执行栈。主线程之外事件触发线程管理着一个任务队列,只要异步任务有了运行结果,就在任务队列中方置一个事件,一旦执行栈中的所有同步任务执行完毕后(JS引擎空闲),系统就会读取任务队列,将可运行的异步任务添加到可执行栈中开始执行。
 
这里还用到了宏任务和微任务的知识点:
宏任务:可以理解每次执行栈执行的代码就是一个宏任务包括每次从事件队列中获取一个事件回调并放到执行栈中执行。
微任务:可以理解当宏任务执行结束后立即执行的任务。
Promise和async中的立即执行 
Promise的异步执行体现在then和catch上,所以Promise中的代码是当作同步任务执行,而async/await中,在出现await出现之前,其中的代码也是立即执行的,实际上await是一个让出线程的标志await后面的代码会先执行一遍,将await后面的代码加入到微任务中,然后跳出整个async函数执行后面的代码。
可以看到上面的代码中有2个async函数,async函数中在await之前的代码会立即执行,遇到await后会将await后面的表达式执行一遍输出async2将await后面的代码加入到微任务中等待执行,Promise和setTimeout就不多介绍了Promise的异步属于微任务,setTimeout属于宏任务,所以会先执行Promise的异步代码。
posted @ 2019-07-13 15:48  不负好时光i  阅读(269)  评论(0编辑  收藏  举报