一、前言

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

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. C# bootstrap之表格动态绑定值

    这段时间研究了下bootstrap,打算从表格开始学习,实现动态绑定值,在网上找了挺多例子,但是很少有写全的,要不就太复杂,实现效果后总结一下,直接拷贝过去可以用. 第一步:先去官网上下载bootst ...

  2. My97设置开始、结束 时间区间及输入框不能输入只能选择的方法

    时间区间开始: <input type="text" id = "first_time" name="first_time" valu ...

  3. java stream 原理

    java stream 原理 需求 从"Apple" "Bug" "ABC" "Dog"中选出以A开头的名字,然后从中选 ...

  4. 从零搭建 webpack3 环境 #1 - 安装使用

    目录: (1)什么是webpack (2)webpack核心概念 (3)环境安装 (4)开始使用webpack 1.什么是webpack 官网的一幅图对webpack的解释,从图中可以看出,webpa ...

  5. Python入门之函数的嵌套/名称空间/作用域/函数对象/闭包函数

    本篇目录: 一.函数嵌套 二.函数名称空间与作用域 三.函数对象 四.闭包函数 ============================================================ ...

  6. ios8新的api

    self.navigationController.hidesBarsOnSwipe=YES; 滚动时隐藏导航栏

  7. windows系统设置虚拟机开机自启并运行虚拟系统

    简述 很多用windows系统电脑开发的童鞋,会在自己电脑上装一个虚拟机,然后在装一个linux系统当作服务器来使用. 但每次电脑开机都要去重启一下虚拟机电源,实在是不划算.下面博主教大家在windo ...

  8. Python/Django-Web原理(一)

    Python/Django-Web原理(一) websocket webSocket协议是基于TCP的一种新的协议.WebSocket最初在HTML规范中被引用为TCP连接,作为基于TCP的套接字AP ...

  9. nginx nfs服务

    一.nginx服务 1.二进制安装nginx包 [root@bogon ~]# ls /etc/yum.repos.d/ [root@bogon ~]# cd /etc/yum.repos.d/ [r ...

  10. Http读书笔记1-5章

    第一章 内容提要 这一章主要介绍了什么是http以及http是干嘛的,以及与之有关的相关概念,当然了这些概念都是概览式的介绍一些.所以我将采用问答式的方式描述这一章! Q:http是干嘛的? A:ht ...