await 和 async 的用法

2019-06-06  本文已影响0人  缺月楼

前提是你已经会使用Promise先看一下MDN是怎么解释的:

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

看以下代码:了解一下他的用法

await 操作符用于等待一个Promise 对象。它只能在异步函数 async function 中使用。

function fn(){
  return new Promise((resolve,reject)=>{ //必须要掌握这句
  setTimeout(()=>{
      let n = parseInt(Math.random() * 6 + 1 ,10 ) /*1~7之间的随机数,*/
      resolve(n)
  },3000)
})
}


**具体的用法看这里 test()是一个3秒之后执行的函数 必须要用一个 async function  进行特殊声明 **
async function test(){
    let n = await fn()
    console.log(n)
  }
test()   /*3秒后执行Promise 随机打印出1-7之间的整数*/

接着看 : 如果这个Promise失败了怎么办 ?

function fn(猜测){
  return new Promise((resolve,reject)=>{ //必须要掌握这句
    setTimeout(()=>{
      let n = parseInt(Math.random() * 6 + 1 ,10 ) /*1~7之间的随机数,*/
      if(n > 3 ){
        if(猜测 === "大"){
          resolve(n)
        } else{
          reject(n)
        }
      }else {
        if(猜测 === "小") {
          resolve(n)
        } else{
          reject(n)
        }
      }

    },3000)
  })
}

async function test(){
//要配合try{}catch()使用,不然会报错  如果传进去的结果fn("结果")是false的话 会报错 
  try{
    let n = await fn("大")//传进去结果 
    console.log("赢了"+n)
  }catch (error) {
    console.log("输了"+error)
  }

}
test();

面试题 : 为什么要用await 可以用MDN上的一句话概括

如果你的代码使用了异步函数,它的语法和结构会更像是标准的同步函数

如果同时使用生成两个随机数呢 ?看一下代码
先用Promise.all试一下,Promise.all要等两个结果都出来了再执行then()如果两个结果有一个错了,就不会继续往下执行

function fn(猜测){
  return new Promise((resolve,reject)=>{ //必须要掌握这句
    setTimeout(()=>{
      let n = parseInt(Math.random() * 6 + 1 ,10 ) /*1~7之间的随机数,*/
      if(n > 3 ){
        if(猜测 === "大"){
          resolve(n)
        } else{
          reject(n)
        }
      }else {
        if(猜测 === "小") {
          console.log("失败了")
          resolve(n)
        } else{
          reject(n)
        }
      }

    },3000)
  })
}
Promise.all([fn("大"),fn("小")])
  .then((x)=>{console.log(x)},
         (y)=>{console.log(y)}
       )
// async function test(){
//   try{
//     let n = await fn("大")
//     console.log("赢了"+n)
//   }catch (error) {
//     console.log("输了"+error)
//   }

// }
// test();
用await写法 记住 await 后面永远跟的都是Promise对象
function fn(猜测){
  return new Promise((resolve,reject)=>{ //必须要掌握这句
    setTimeout(()=>{
       let n =  6  // parseInt(Math.random() * 6 + 1 ,10 ) 1~7之间的随机数, 暗箱操作一下 结果设定为6 
      if(n > 3 ){
        if(猜测 === "大"){
          resolve(n)
        } else{
          reject(n)
        }
      }else {
        if(猜测 === "小") {
          console.log("失败了")
          resolve(n)
        } else{
          reject(n)
        }
      }

    },3000)
  })
}
// Promise.all([fn("大"),fn("小")])
//   .then((x)=>{console.log(x)},
//          (y)=>{console.log(y)}
//        )
async function test(){
  try{
    let n = await Promise.all([fn("大"),fn("大")])   //这里n 是一个数组  [6,6]
    console.log("赢了"+ n)
  }catch (error) {
    console.log("输了"+error)
  }

}
test(); //一个Promise 所有async function都会返回一个Promise

所有async function都会返回一个Promise 代码中的test()就是一个Promise!

上一篇 下一篇

猜你喜欢

热点阅读