async搭配await是ES7提出的,它的实现是基于Promise。这里使用它对比Promise的用法,这里只是简单的适合日常业务的使用场景。
 
async、await是ES7中的提案,通过同步方式的写法,使得代码更容易阅读。
 
注意:await函数不能单独使用,而且async函数返回的是一个Promise对象,可以使用then函数添加回调函数。当函数执行的时候,一旦遇到await函数就会先返回一个Promise对象,等到异步操作完成,再去执行后面的语句。如果 await 后面的异步操作出错,那么等同于 async 函数返回的 Promise 对象被 reject!
Promise是ES6的新特性,用于处理异步操作逻辑,用过给Promise添加then和catch函数,处理成功和失败的情况,下面就两种情况介绍异步,刚刚入门把自己的理解写出来沉淀一下。
 
function timeout(ms) {
return new Promise(resolve => {
setTimeout(resolve, ms);
})
}
// 调用函数
async function asyncPrint(value, ms) {
await timeout(ms);
console.log(value);
}
// 调用函数
asyncPrint('timeout', 2000); // 2s之后打印出'timeout',如果不相信可以使用vscode编辑器的run code插件,会把执行时间展示给你!
 
下面是Promise的实现同样的功能
function timeout1(ms) {
return new Promise(resolve => {
setTimeout(resolve, ms);
})
}
 
// 因为上面函数返回是的Promise对象,所以直接使用链式方法then时,是在Promise对象内的函数执行完之后执行的,这样就可以达到上面同样的结果
timeout1(5000).then(() => {
console.log('timeout1'); // 5s之后打印出'timeout1'
})
这里多啰嗦两句,即使我们的设定的延时器的时间是2s和5s,但是真的跑出来的时间其实会多于2s和5s,这是因为执行其他的代码也会浪费时间啊,只是我们的感知不强而已,而且这是没办法避免的。即使你写的时间间隔为0,它也不会实现理想情况下的立即执行,原因就是刚刚说的那样。
 
个人喜欢async和await的写法,主要是阅读代码的时候更加语义化,看着舒服。而且看到一些权威文章上也推荐async 、await 去处理异步情况,(原画:async函数可以说是目前异步操作最好的解决方案)。

promise 和 async await比较的更多相关文章

  1. node.js异步控制流程 回调,事件,promise和async/await

    写这个问题是因为最近看到一些初学者用回调用的不亦乐乎,最后代码左调来又调去很不直观. 首先上结论:推荐使用async/await或者co/yield,其次是promise,再次是事件,回调不要使用. ...

  2. Promise, Generator, async/await的渐进理解

    作为前端开发者的伙伴们,肯定对Promise,Generator,async/await非常熟悉不过了.Promise绝对是烂记于心,而async/await却让使大伙们感觉到爽(原来异步可以这么简单 ...

  3. 异步操作之 Promise 和 Async await 用法进阶

    ES6 提供的 Promise 方法和 ES7 提供的 Async/Await 语法糖都可以更好解决多层回调问题, 详细用法可参考:https://www.cnblogs.com/cckui/p/99 ...

  4. Promise及Async/Await

      一.为什么有Async/Await? 我们都知道已经有了Promise的解决方案了,为什么还要ES7提出新的Async/Await标准呢? 答案其实也显而易见:Promise虽然跳出了异步嵌套的怪 ...

  5. callback vs async.js vs promise vs async / await

    需求: A.依次读取 A|B|C 三个文件,如果有失败,则立即终止. B.同时读取 A|B|C 三个文件,如果有失败,则立即终止. 一.callback 需求A: let read = functio ...

  6. Callback, Promise和Async/Await的对比

    Callback, Promise和Async/Await的对比 Callback Hell getData1(function (data1) { console.log('我得到data1了') ...

  7. 异步Promise及Async/Await最完整入门攻略

    一.为什么有Async/Await? 我们都知道已经有了Promise的解决方案了,为什么还要ES7提出新的Async/Await标准呢? 答案其实也显而易见:Promise虽然跳出了异步嵌套的怪圈, ...

  8. “setTimeout、Promise、Async/Await 的区别”题目解析和扩展

    解答这个题目之前,先回顾下JavaScript的事件循环(Event Loop). JavaScript的事件循环 事件循环(Event Loop):同步和异步任务分别进入不同的执行"场所& ...

  9. promise 进阶 —— async / await 结合 bluebird

    一.背景 1.Node.js 异步控制 在之前写的 callback vs async.js vs promise vs async / await 里,我介绍了 ES6 的 promise 和 ES ...

  10. 异步Promise及Async/Await可能最完整入门攻略

    此文只介绍Async/Await与Promise基础知识与实际用到注意的问题,将通过很多代码实例进行说明,两个实例代码是setDelay和setDelaySecond. tips:本文系原创转自我的博 ...

随机推荐

  1. C#的静态类

    静态类 静态类与非静态类的重要区别在于静态类不能实例化,也就是说,不能使用 new 关键字创建静态类类型的变量.在声明一个类时使用static关键字,具有两个方面的意义:首先,它防止程序员写代码来实例 ...

  2. SpringCloud2.0 Feign 服务发现 基础教程(五)

    1.启动[服务中心]集群,即 Eureka Server 参考 SpringCloud2.0 Eureka Server 服务中心 基础教程(二) 2.启动[服务提供者]集群,即 Eureka Cli ...

  3. 2019年杭电多校第一场 1002题Operation(HDU6579+线性基)

    题目链接 传送门 题意 初始时有\(n\)个数,现在有\(q\)次操作: 查询\([l,r]\)内选择一些数使得异或和最大: 在末尾加入一个数. 题目强制在线. 思路 对于\(i\)我们记录\([1, ...

  4. 剑指Offer_编程题-003 - 输入一个链表,按链表值从尾到头的顺序返回一个ArrayList

    如题 (总结) 首节点也存放了值,所以ListNode t = listNode; 直接从头开始遍历即可. 简单题目,但是构建的时候出了点问题,毕竟需要自己简单测测. 掌握链表的构建方法, 还要根据题 ...

  5. jenkins中jmeter项目流程图

  6. 网络测试工具--Iperf、Netperf 、MZ

    网络性能测量的五项指标 可用性(availability) 响应时间(response time) 网络利用率(network utilization) 网络吞吐量(network throughpu ...

  7. git更换仓库,保留分支,保留提交记录及开发权限

    别人推荐的方法都很复杂,这个步骤自己亲自尝试过,非常简单好用. 1.从原地址克隆一份裸版本库,比如原本托管于 GitHub. git clone --bare https://github....(原 ...

  8. Java Array、List、Set互相转化

    https://blog.csdn.net/u014532901/article/details/78820124

  9. 第5章 Spring的事务管理

    5.1 Spring事务管理概述 5.11 事务管理的核心接口 在Spring的所有jar包中,有一个名spring-tx-4.3.6RELEAS的jar包,是提供事务管理的依赖包.在该包的org.s ...

  10. jquery ajax在ie9下跨域不执行 crossDomain: true == !(document.all)

    <!DOCTYPE html> <html> <head> <title>jQuery CORS in IE7 - IE10</title> ...