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. postgresql9.5编译安装体验

    实验环境: centos7.6 pgsql9.5 源码编译安装 实验目的: 体验源码编译安装pgsql 01.download https://ftp.postgresql.org/pub/sourc ...

  2. Linux学习之组管理和权限管理

    Linux组的基本介绍 在Linux中的每个用户必须属于一个组,不能独立于组外.在Linux中每个文件有所有者,所在组,其他组的概念. 1)所有者 2)所在组 3)其他组 4)改变用户所在的组 文件/ ...

  3. centos7服务器部署django项目。

    用到的工具,xftp(文件互传),xshell(远程连接) aliyun服务器防火墙开启的端口.80,22(ssh),3306(mysql),8000,9090 部署项目: 1,安装nginx 1&g ...

  4. WebLogic任意文件上传漏洞(CVE-2019-2618)

    WebLogic任意文件上传漏洞(CVE-2019-2618) 0x01 漏洞描述 漏洞介绍 CVE-2019-2618漏洞主要是利用了WebLogic组件中的DeploymentService接口, ...

  5. scala简单的功能实现~weekone

    以下是scala简单的入门题~ 1.⼀个数字如果为正数,则它的signum为1:如果是负数,怎么signum为-1:如果是0,则signum 为0.编写⼀个函数来计算这个值. object Test ...

  6. 将公式直接转化为Latex代码的神器-snip

    经常用latex写论文,免不了要敲各种公式,今天和大家分享一个神器-snip,它可以直接将公式转化为代码,不需要我们自己编写公式代码,方便快捷,准确率极高.该神器的下载地址为:https://math ...

  7. new.target元属性 | 分别用es5、es6 判断一个函数是否使用new操作符

    函数内部有两个方法 [[call]] 和 [[construct]] (箭头函数没有这个方法),当使用new 操作符时, 函数内部调用 [[construct]], 创建一个新实例,this指向这个实 ...

  8. 加深对 JavaScript This 的理解

    我相信你已经看过很多关于 JavaScript 的 this 的谈论了,既然你点进来了,不妨继续看下去,看是否能帮你加深对 this 的理解. 最近在看 <You Dont Know JS> ...

  9. multipart/form-data与数据封装

    方案一: 将所有数据先格式化(编码)成可读字符串,然后转化成bytes的形式. 方案二: 将每一个部分分别转化成(或者直接使用)bytes的形式,然后串联到一起. http://www.jianshu ...

  10. Linglong combination

    Graphic calculator usually refers to a kind of hand-held calculator that can draw function images, s ...