Callback、Promise、async/await

一、Callback回调函数
例子：

asyncFun1((err,result1)=>{
  if(err){
    console.error(err)    
  }
  asyncFun2((err,result2)=>{
    if(err){
       console.error(err)    
     }
     asyncFun3(()=>{
       if(err){
          console.error(err)
        }
     },result2)//把前面操作的结果result2传进来
  },result1)
})

callback函数应用举例：

image.png
image.png

就是通过callback回调函数来传回数据

缺点：多重嵌套，容易造成“回调地狱”，解决办法是Promise
二、Promise
例子：

asyncFun1()//内部函数执行是异步的，不知道什么时候执行成功，所以如果成功就调resolve()，失败就调reject()
.then(result=>{//然后作为then的参数接收调用结果，then('success','failure')，这里failure可选
  return asyncFun2(result)//又是一个Promise对象
})
.then(result=>{
  return asyncFun3(result)
})
.catch(err=>{//统一的catch做错误处理
  console.error(err)
})

promise应用举例:

image.png
image.png

也就是通过返回一个promise对象，把收到的结果放到成功之后的resolve函数里传回到调用该函数的地方

缺点：不能用try/catch，并且还是一个异步形式的代码（心智负担），解决办法是async/await
三、async/await
例子：

async function asyncMain(){//async表示函数里有异步操作
  try{
    const result=await asyncFun1()//await表示紧跟在后面的表达式需要等待结果
    result=await asyncFun2(result)
    result=await asyncFun3(result)
  }catch(e){
    console.error(e)
  }
}
asyncMain()

注：对async/await的补充
其实async函数就是Generator函数的语法糖，其本质是Generator函数，以下为Generator函数的介绍。
例子：

function* gen(x){//有个内部指针（遍历器）g
  var y=yield x+2;//异步操作需要暂停的地方用yield声明
  return y;
}

执行用next()，如var g=gen(1);g.next()就是进行第一个yield输出3，再g.next()因为没有yield需要执行了就返回undefined，当然如果执行g.next(2)就返回传的参数2

参考：https://zhuanlan.zhihu.com/p/23249103?utm_medium=social&utm_source=weibo