Promise

Promise 对象用于表示一个异步操作的最终状态(完成或失败),以及该异步操作的结果值。

摇色子游戏,随机1-6的一个整数,并且将其返回。

function fn() {
return new Promise((resolve, seject) => {
setTimeout(() => {
let n = parseInt(Math.random) * 6 + 1,10)// 1-6
resolve(n)
}, 3000)
})
}

fn().then(
  (x) => { console.log('色子的点数是' + x) },
  () => { console.log('色子坏了')}
)

async和await

**async function** 声明用于定义一个返回 AsyncFunction 对象的异步函数。异步函数是指通过事件循环异步执行的函数,它会通过一个隐式的 Promise 返回其结果。但是如果你的代码使用了异步函数,它的语法和结构会更像是标准的同步函数。

async function 声明异步函数

function 声明同步函数

function fn() {
return new Promise((resolve, seject) => {
setTimeout(() => {
let n = parseInt(Math.random) * 6 + 1,10)// 1-6
resolve(n)
}, 3000)
})
}

async function test() {
   let n = await fn();
   console.log(n)
}

test()

再增加try...catch语句来捕获异常

function fn() {
return new Promise((resolve, seject) => {
setTimeout(() => {
let n = parseInt(Math.random) * 6 + 1,10)// 1-6
           if (n>3){
               if (猜测 === '大') {
               resolve(n);
              } else {
                   reject(n);
              }
          } else {
               if (猜测 === '小') {
               resolve(n);
              } else {
                   reject(n);
              }
          }  
}, 3000)
})
}

async function test() {
   try {
let n = await fn("大");
  console.log("好嗨哟" + n)
  }catch (error) {
console.log("输光了" + n)
  }  
}

fn("大").then(f1, f2).then(f3, f4)
test()

为什么不使用promise.then,而使用async await?

使异步代码看起来更像是同步代码,async await看起来更清晰简单

如果有两个色子,并且猜大小都猜对了才算成功,该怎么做呢?

Promise.all() 这个方法返回一个新的promise对象,该promise对象在iterable参数对象里所有promise 对象都成功的时候才会触发成功,一旦有任何一个iterable里面的promise对象失败则立 即触发该promise对象的失败。

Promise.race() 当iterable参数里的任意一个子promise被成功或失败后,父promise马上也会用子 promise的成功返回值或失败详情作为参数调用父promise绑定的相应句柄,并返回该 promise对象。

function 猜大小() {
return new Promise((resolve, seject) => {
setTimeout(() => {
let n = parseInt(Math.random) * 6 + 1,10)// 1-6
           if (n>3){
               if (猜测 === '大') {
               resolve(n);
              } else {
                   reject(n);
              }
          } else {
               if (猜测 === '小') {
               resolve(n);
              } else {
                   reject(n);
              }
          }  
}, 3000)
})
}

Promise.all([猜大小('大'), 猜大小('小')])
.then(() => {}, () => {})

async function test() {
   try {
let n = await Promise.all([猜大小('大'), 猜大小('小')]);
  console.log("好嗨哟" + n)
  }catch (error) {
console.log("输光了" + n)
  }  
}

promise ,async 小记的更多相关文章

  1. vue使用技巧:Promise + async + await 解决组件间串行编程问题

    业务场景描述 大家都通过互联网投递过简历,比如在智联.58.猎聘等平台.投递心仪的职位前一般都需要前提创建一份简历,简历编辑界面常规的布局最上面是用户的个人基本信息,如姓名.性别.年龄.名族等,接着是 ...

  2. nodejs 回调地狱解决 promise async

    nodejs毁掉地狱是一直被人诟病的,以下总结一下解决毁掉地狱的一些方法.(暂时研究的比较浅) 1.promise promise模式在任何时刻都处于以下三种状态之一:未完成(unfulfilled) ...

  3. angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )

    Promise 是 ES 6 Async/Await 是 ES 7 Rxjs 是一个 js 库 在使用 angular 时,你会经常看见这 3 个东西. 它们都和异步编程有关,有些情况下你会觉得用它们 ...

  4. promise async await使用

    1.Promise (名字含义:promise为承诺,表示其他手段无法改变) Promise 对象代表一个异步操作,其不受外界影响,有三种状态: Pending(进行中.未完成的) Resolved( ...

  5. promise async

    最简用  promise let res = function () { return new Promise((resolve, reject) => { // 返回一个promise set ...

  6. Promise,async/await解决回调地狱

    先说一下async的用法,它作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行. 写一个async 函数 as ...

  7. ES6 class setTimeout promise async/await 测试Demo

    class Person { async getVersion () { return new Promise((resolve, reject) => { setTimeout(functio ...

  8. lazy evaluation and deferring a computation await promise async

    Promise - JavaScript | MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_ ...

  9. promise, async和await

    最开始实现异步的方法:回调函数 method1(function(err, result) { if (err) { throw err; } method2(function(err, result ...

随机推荐

  1. Sentry 官方 JavaScript SDK 简介与调试指南

    系列 1 分钟快速使用 Docker 上手最新版 Sentry-CLI - 创建版本 快速使用 Docker 上手 Sentry-CLI - 30 秒上手 Source Maps Sentry For ...

  2. JDBC操作多张表一

    一.操作一对多情况开发步骤1创建对象 //代码部门的对象public class Department { private String id; private String name; privat ...

  3. <C#任务导引教程>练习八

    //66,静态成员与非静态成员的访问方式using System;class Text{    public int x;    public static int y;//静态数据成员    voi ...

  4. [atARC070E]NarrowRectangles

    记$len_{i}=r_{i}-l_{i}$,即第$i$个区间的长度 用$f_{i,j}$表示前$i$个区间合法,第$i$个区间位于$[j,j+len_{i}]$的最小代价,暴力dp的时间复杂度为$o ...

  5. [cf1396E]Distance Matching

    根据$dis(x,y)=d[x]+d[y]-2d[lca(x,y)]$,由于所有点都出现了1次,距离即$\sum_{i=1}^{n}d_{i}-2\sum d[lca(x,y)]$(以下假设根深度为0 ...

  6. js防止重复提交代码

    if (checkSubmitFlg == true) { console.log("禁止频繁操作.."); layer.close(ide); return false; } c ...

  7. 前端jsdebug调试

    前端如何像java一样的debug呢? 1.在js页面加入debugger next: function(){ debugger var type=this.quiz[this.progress].s ...

  8. Mybatis类型转换BUG

    案例:mybatis框架的使用中是否遇到过前台传入数据后mybatis后台并不执行sql的情况呢? 比如:前台传入一个状态var flag //空字符,0,1 然后你用int接收,到mybatis框架 ...

  9. .net core 3.1 WebAPi 使用 AutoMapper 9.0、10.0

    AutoMapper 可以很方便完成数据对象之间的转换. Dto -> Entity Entity -> ViewModel Step 1:通过 NuGet 安装 AutoMapper 的 ...

  10. Atcoder Regular Contest 092 D - Two Faced Edges(图论+bitset 优化)

    Atcoder 题面传送门 & 洛谷题面传送门 orz ymx,ymx ddw %%% 首先既然题目要我们判断强连通分量个数是否改变,我们首先就将原图 SCC 缩个点呗,缩完点后我们很自然地将 ...