一、前言

在项目中经常遇到处理异步请求的情况,面对层层的嵌套,回调显示那么苍白无力;

async / await是ES7的重要特性之一,也是目前社区里公认的优秀异步解决方案,既然这样就用上吧。

二、配置编译

网上实践很多。。。

反倒是Promise在实践过程中加了一个polyfill。

三、实践

await后方法要写成peomise的形式,转成异步形式。大概如下,这样异步操作看起来就像同步操作一样明了。

四、测试

(async function(){
      let step_1 = await step1(); //异步1

      console.log(step_1.result); //同步2
      console.log('step2');       //同步2

      let step_3 = await step3(); //异步3

      console.log(step_3); //同步4
      console.log('step4');       //同步4

    })().catch(err=>{
      console.log(err);
    });

    function step1(){
      return new Promise((resolve, reject) => {
        setTimeout(()=>{
          if(1){
            resolve({
              result:'我是异步step_1返回的数据'
            })
          }else{
            reject()
          }
        },2000);
      })
    }

    function step3(){
      return new Promise((resolve, reject) => {
        setTimeout(()=>{
          if(1){
            resolve('我是异步step_2返回的数据')
          }else{
            reject()
          }
        },2000);
      })
    }

 

 

五、node v7.5以上原生支持async/await

如果不想更新node,可以使用babel

$ npm install --save-dev babel-cli  

$ npm install --save-dev babel-preset-es2015 babel-preset-es2017

 

创建: .babelrc文件

{
 "presets": ["es2015","es2017"]
 }

 

//执行
babel-node xxx.js

  

 

  

关于ES7中的async/await在客户端和服务端上的实践的更多相关文章

  1. 理解ES7中的async/await

    理解ES7中的async/await 优势是:就是解决多层异步回调的嵌套 从字面上理解 async/await, async是 "异步"的含义,await可以认为是 async w ...

  2. 网络编程 UDP协议 TCP局域网客户端与服务端上传下载电影示例

    UDP协议 (了解) 称之为数据包协议,又称不可靠协议. 特点: 1) 不需要建立链接. 2) 不需要知道对方是否收到. 3) 数据不安全 4) 传输速度快 5)能支持并发 6) 不会粘包 7) 无需 ...

  3. 编写Java程序,实现客户端向服务端上传文件的功能

    查看本章节 查看作业目录 需求说明: 实现客户端向服务端上传文件的功能 当启动服务端后,运行客户端程序,系统提示客户在客户端输入上传文件的完整路径.当客户在客户端输入完成后,服务端实现文件上传 实现思 ...

  4. JavaScript ES7 中使用 async/await 解决回调函数嵌套问题

    原文链接:http://aisk.me/using-async-await-to-avoid-callback-hell/ JavaScript 中最蛋疼的事情莫过于回调函数嵌套问题.以往在浏览器中, ...

  5. ES7中的async和await

    ES7中的async和await 在上一章中,使用Promise将原本的回调方式转换为链式操作,这就将一个个异步执行的操作串在一条同步线上了.下一次的操作必须等待当前操作的结束. 使用Promise的 ...

  6. js中的async await

    JavaScript 中的 async/await 是属于比较新的知识,在ES7中被提案在列,然而我们强大的babel粑粑已经对它进行列支持! 如果开发中使用了babel转码,那么就放心大胆的用吧. ...

  7. [C#] .NET4.0中使用4.5中的 async/await 功能实现异

    好东西需要分享 原文出自:http://www.itnose.net/detail/6091186.html 在.NET Framework 4.5中添加了新的异步操作库,但是在.NET Framew ...

  8. 【TypeScript】如何在TypeScript中使用async/await,让你的代码更像C#。

    [TypeScript]如何在TypeScript中使用async/await,让你的代码更像C#. async/await 提到这个东西,大家应该都很熟悉.最出名的可能就是C#中的,但也有其它语言也 ...

  9. 在Silverlight中使用async/await

    现在 async/await 大行其道,确实,有了 async/await ,异步编程真是简单多了,个人觉得 async/await 的出现,给开发者还来的方便,绝不亚于当年 linq 的出现. 但要 ...

随机推荐

  1. apigw鉴权分析(1-5)亚马逊 - 鉴权分析

    一.访问入口 https://developer.amazon.com/public/zh 二.鉴权方式分析 三.分解结论

  2. 表单中各种input汇总

    html表单 表单用于搜集不同类型的用户输入,表单由不同类型的标签组成,相关标签及属性用法如下: 1.<form>标签 定义整体的表单区域 action属性 定义表单数据提交地址 meth ...

  3. 前端学习之jquery

    前端学习之jquery 1.   什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...

  4. tr069开源代码——cwmp移植

    原创作品,转载请注明出处,严禁非法转载.如有错误,请留言! email:40879506@qq.com 声明:本系列涉及的开源程序代码学习和研究,严禁用于商业目的. 如有任何问题,欢迎和我交流.(企鹅 ...

  5. urllib.request.Request

    import urllib.request #可以将url先构造成一个Request对象,传进urlopen #Request存在的意义是便于在请求的时候传入一些信息,而urlopen则不 reque ...

  6. javascript 作用域链与执行环境

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 作用域.作用域链.执行环境.执行环境栈以及this的概念在javascript中非常重要,本人经常弄混淆, ...

  7. 对Spring IOC和AOP的理解

    控制反转(IOC)是什么?(理解好Ioc的关键是要明确"谁控制谁,控制什么,为何是反转(有反转就应该有正转了),哪些方面反转了") 1.Ioc-Inversion of Contr ...

  8. LoggerOne

    LoggerOne 一个高效.简约.灵活高性能的遵循 PSR-3 的 PHP 日志类库实现. 特性 天然的缓存特性(Logger实例属性),延迟批量写入. 安装&使用 Install $ co ...

  9. webstorm git团队开发技巧总结(一)

    ---恢复内容开始--- 1.git查看和修改用户名,邮箱 用户名和邮箱地址是本地git客户端的一个变量,不随git库而改变.每次commit都会用用户名和邮箱记录. (1)查看用户名和地址 git ...

  10. spring源码阅读(2)核心类介绍

    (1).BeanFactory作为一个主接口不继承任何接口,暂且称为一级接口. (2).有3个子接口继承了它,进行功能上的增强.这3个子接口称为二级接口. (3).ConfigurableBeanFa ...