promise

  1. // 先构造一个 promise 函数
  2. // resolve 和 reject 都是一个函数
  3. // resolve 在成功时调用
  4. // reject 在失败时调用
  5. function promise() {
  6. return new Promise((resolve, reject) => {
  7. let tar = Math.random(0, 1)
  8. if (tar > 0.5) {
  9. console.log('suceess')
  10. setTimeout(function() {
  11. resolve('resolve')
  12. }, 1000)
  13. } else {
  14. console.log('fail')
  15. setTimeout(function() {
  16. reject('reject')
  17. }, 1000)
  18. }
  19. })
  20. }
  21. // then 和 catch 第一个参数为resolve状态时的回调,第二个参数为reject状态时的回调
  22. // catch 相当于 then(null, reject)
  23. promise().then(
  24. (resolve) => console.log('then', resolve)
  25. ).catch(
  26. (reject) => console.log('catch', reject)
  27. )
  28. // then 后面还可以接 then 一直链式调用
  29. // 第一个 then 接受的参数是 resolve 函数传过来的参数
  30. // 第二个 then 接受一个参数是第一个 then 返回的值
  31. promise().then(
  32. (resolve) => (resolve + 1) // 接受 resolve 返回 resolve + 1
  33. ).then(
  34. (plusOne) => console.log(plusOne) // 接受 resolve +1 并打印
  35. ).catch(
  36. (reject) => console.log('catch', reject)
  37. )

async

  1. // 同样需要一个 promise 对象
  2. function promise() {
  3. return new Promise((resolve, reject) => {
  4. let tar = Math.random(0, 1)
  5. if (tar > 0.5) {
  6. console.log('success')
  7. setTimeout(function() {
  8. resolve('resolve')
  9. }, 1000)
  10. } else {
  11. console.log('fail')
  12. setTimeout(function() {
  13. reject('reject')
  14. }, 1000)
  15. }
  16. })
  17. }
  18. // 只是调用的方法跟 then/catch 不一样
  19. // async 函数执行时,一旦遇到 await 就会先返回,等异步操作完成,再接着执行后面的操作
  20. async function async() {
  21. const res = await promise()
  22. console.log(res)
  23. console.log('wait')
  24. return res
  25. }
  26. // async 函数返回 promise 对象
  27. // 只有函数内的 await 语句全部执行完,或者遇到 return 或 抛出错误,才会发生状态改变
  28. // 如果发生错误或状态为 reject 则执行 catch
  29. async().then(
  30. (res) => console.log(res)
  31. ).catch(
  32. (e) => console.log(e)
  33. )

promise 和 async 的用法的更多相关文章

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

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

  2. 前端异步编程之Promise和async的用法

    传统的异步解决方案采用回调函数和事件监听的方式,而这里主要记录两种异步编程的新方案: ES6的新语法Promise ES2017引入的async函数 Generator函数(略) Promise的含义 ...

  3. promise和async/await的用法

    promise和async都是做异步处理的, 使异步转为同步 1.promise 它和Promise诞生的目的都是为了解决“回调地狱”, promise使用方法: <button @click= ...

  4. Promise、async、await在Egret的简单应用

    Egret Engnie 5.1.10 Egret Wing 4.1.5 一.Promise.async.await相关知识 Promise介绍 阮一峰 async函数 阮一峰 具体和详细的说明用法可 ...

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

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

  6. promise、async和await

    async:async function 声明将定义一个返回 AsyncFunction 对象的异步函数.当调用一个 async 函数时,会返回一个 Promise 对象.当这个 async 函数返回 ...

  7. Promise和async/await

    1.promise对象 promise 对象有三种状态:pending(进行中).fulfilled(已成功)和 rejected(已失败).promise 对象的状态改变,只有两种可能:从 pend ...

  8. Promise 和async/await 的使用理解

    Promise 和async/await 的使用理解 1. new Promise时就会开始执行语句. new Promise(resolve => resolove('成功信息') )     ...

  9. 20分钟带你掌握JavaScript Promise和 Async/Await

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文出处:https://www.freecodecamp.org/news/learn-promise-a ...

随机推荐

  1. 将STM32 iap hex文件与app hex文件合并为一个hex文件

    日前公司产品需要增加远程升级功能,boot loader程序写好后交予生产部门使用时他们反馈每个产品程序需要刷写两次(一个boot loader 一个app程序),生产进度变慢浪费时间,于是乎研究如何 ...

  2. toolbar ,textfield,图片拉伸,Bundle

    1   工具栏   UIToolbar 2   textField 协议方法 一旦TextField成为第一响应,此方法就会调用 - (void)textFieldDidBeginEditing:(U ...

  3. Oracle 11gR2 用exp无法导出空表解决方法

    Oracle 11gR2 用exp无法导出空表解决方法 在11gR2中有个新特性,当表无数据时,不分配segment以节省空间.Oracle 当然在运行export导出时,空表则无法导出,可是还是有解 ...

  4. 联动加入redmine的wik

    <? php error_reporting(E_ERROR); date_default_timezone_set('Asia/Shanghai'); $red_server = " ...

  5. COCOS学习笔记--关于使用cocostudio打安卓包

    我在之前的博客里也写到过,如今cocos引擎提供了一键打包.很方便. 今天正好做个測试,想用引擎的一键打包弄个apk的安卓包.以下就简介一下详细过程和自己的一些理解: 先说一下项目背景,因为我的电脑是 ...

  6. recover all files with git

    leon@DGLIRUAN2 /F/linux/android/leon/workspace/AngoWidget (master) $ git log commit 2f847e3a858ecb2f ...

  7. 自学Zabbix3.8.1.1-可视化Visualisation-Graphs简单图表

    自学Zabbix3.8.1.1-可视化Visualisation-Graphs简单图表 Zabbix提供了一些简单的图表,用于可视化由项目收集的数据. 用户不需要进行配置工作来查看简单的图表.他们是由 ...

  8. Ubuntu安装微信开发者工具

    参考教程:https://ruby-china.org/topics/30339 1.下载nw sdk $ wget -c http://dl.nwjs.io/v0.15.3/nwjs-sdk-v0. ...

  9. javascript-发布订阅模式

    说明:本篇文章转载自小火柴的蓝色理想的一篇博文.原文地址:http://www.cnblogs.com/xiaohuochai/p/8031564.html 发布-订阅模式又叫观察者模式,它定义对象间 ...

  10. 37、mysql初识

    之前我们写代码需要存取信息时用的是文件可是用文件存取数据非常局限,今天我们将走进一个新的世界mysql 一.数据库由来 之前所学,数据要永久保存,比如用户注册的用户信息,都是保存于文件中,而文件只能存 ...