示例代码如下
req = (ms)=>{
return new Promise((resolve,reject)=>{
console.log('ff')
setTimeout(()=>{
console.log('dd')
resolve('pp')
},ms)
})
}
aa = async ()=>{
console.log('aa')
await req(5000).then(data=>{console.log(data)})
console.log('cc')
}
bb=()=>{
console.log('bb')
}
aa();
//aa();
bb();
注解
程序开始执行 =>
执行a()=>
打印aa=>
执行req()=>
**打印ff => ** //前面都是按代码顺序同步执行
settimeou进入timer队列 => // settimeout 为异步操作 社区内大佬写的eventloop详解
**promise进入pennding状态=> ** //promise 共有三个状态 一旦发生转换是不可改变的 阮一峰老师写的es6入门里有详细介绍
**await 执行让出线程控制权=> ** // async函数为Generator+co模块的语法糖 同时这里引入了协程的概念 Generator只是容器 并不执行任何代码 yeild 和awiat
可以人为控制代码执行的时间点 (原话就是让出线程控制权 )
执行b()=>
打印bb=>
js主线程为空不执行任何代码 等待异步结果返回=> 当主线程空闲的时候 才会执行eventloop各个队列返回的回调函数 这里引入macrotask 和 microtask的概念 详细请看这里
时间到了 settimeout执行=>
打印dd=>
resolve()执行=>
**promise变为成功状态=> **
**.then()执行打印pp=> ** // 这里执行完回调就会继续按顺序执行 所以才会感觉像同步的写法 如果后面继续执行遇到await依旧是 先返回 去执行别的代码
最后打印cc
程序结束
注意 markdown 格式
代码格式看着难受