记录高级js学习（二十）异步代码的处理方案await/async

异步代码的处理方案以及相应的模拟示例：

模拟一个2s的异步请求，需求：把每次请求的结果拼接字符串再传给下一次请求

      // 模拟一个2s的异步请求，需求：把每次请求的结果拼接字符串再传给下一次请求
      function requestData(str){
        return new Promise((resolve,reject)=>{
          setTimeout(()=>{
            resolve(str)
          },1000)
        })
      }
      // 方案1：多次回调（回调地狱）
      // requestData("shuai").then(res=>{
      //   requestData(res+"aaa").then(res=>{
      //     requestData(res+"bbb").then(res=>{
      //       console.log('res: ', res);
      //     })
      //   })
      // })

      // 方案2：Promise的链式调用(可读性差，需要一层一层往下看)
      // requestData("shuai").then(res=>{
      //   return requestData(res+"aaa")
      // }).then(res=>{
      //   return requestData(res+"bbb")
      // }).then(res=>{
      //   console.log('res: ', res);
      // })

      // 方案3：Promise + generator 实现
      function* getData(){
        const res1 = yield requestData("shuai")
        const res2 = yield requestData(res1+"aaa")
        const res3 = yield requestData(res2+"bbb")
        console.log('res3: ', res3);
        return res3
      }
      // const generator = getData()
      // generator.next().value.then(res=>{
      //   generator.next(res).value.then(res=>{
      //     generator.next(res).value.then(res=>{
      //       console.log('res: ', res);
      //     })
      //   })
      // })
      // 自动化上面代码
      // function execGenerator(genFn){
      //   const generator = genFn()
      //   function exec(res){
      //     const result = generator.next(res)
      //     if(result.done){
      //       return result.value
      //     }
      //     result.value.then(res=>{
      //       exec(res)
      //     })
      //   }
      //   exec()
      // }
      // execGenerator(getData)

      // 方案4：npm install co  
      // const co = require("co") //require需要node环境运行,浏览器不识别
      // co(getData)

      // 最终方案5：ES8的await/async,本质是上面的语法糖
      async function getDataNew(){
        const res1 = await requestData("shuai")
        const res2 = await requestData(res1+"aaa")
        const res3 = await requestData(res2+"bbb")
        console.log('res3: ', res3);
      }
      getDataNew()