Promise的使用

Promise接受一个进行异步操作的执行函数(executor), 默认参数是resolve和reject，执行成功则调用resolve，返回结果，出现error则调用reject

  1. let promise = new Promise((resolve, reject)=>{
  2.   setTimeout(()=>{
  3.     let n = Math.floor(Math.random() * 6 + 1)
  4.     if(n > 3){
  5.       resolve(n)
  6.     } else {
  7.       reject(new Error('you lose'))
  8.     }
  10.   },1000)
  11. })

.then和.catch

promise接受.then操作，then的参数为2个函数，如果promise resolve则调用第一个函数，如果reject则调用第二个函数

  1. promise.then((res)=>{console.log(res)}, (err)=>{console.log(err)})

如果只想捕获error, 可以用.catch

  1. promise.catch(err => {console.log(err)})

当然你也可以写一个函数，让这个函数返回promise

  1. function fn(){
  2.   return new Promise((resolve, reject)=>{
  3.   setTimeout(()=>{
  4.     let n = Math.floor(Math.random() * 6 + 1)
  5.     if(n > 3){
  6.       resolve(n)
  7.     } else {
  8.       reject(new Error('you lose'))
  9.     }
  11.   },1000)
  12.   })
  13. }
  15. fn().then((res)=>{console.log(res)}, (err)=>{console.log(err)})

Promise的API

Promise.all 接受一个promise数组，等待所有的promise都settle，如果所有的promise都resolve, 则执行.then的第一个函数，返回值是个数组，只要有任意一个promise reject，就抛出错误，执行.then的第二个函数

  1. function fn(){
  2.   return new Promise((resolve, reject)=>{
  3.   setTimeout(()=>{
  4.     let n = Math.floor(Math.random() * 6 + 1)
  5.     if(n > 3){
  6.       resolve(n)
  7.     } else {
  8.       reject(new Error('you lose'))
  9.     }
  11.   },1000)})
  12. }
  14. Promise.all([fn(), fn()])
  15. .then((res)=>{console.log(res)}, (err)=>{console.log(err)})

Promise.race 同样接受一个promise数组，只要有一个promise resolve或reject, 其他的promise就会忽略，并根据这个promise是resolve还是reject各自调用.then的函数

Promise.allSettled同样接受一个promise数组，会等待所有promise settle, 返回的结果数组，包含了每个promise的status和 value或reason

  1. [
  2.   {status: 'fulfilled', value: ...response...},
  3.   {status: 'fulfilled', value: ...response...},
  4.   {status: 'rejected', reason: ...error object...}
  5. ]

async/await

async能与promise结合使用，使异步函数更像是标准的同步函数
function前的关键字async的作用：

  • 让这个函数总是返回一个 promise。
  • 允许在该函数内使用 await。

Promise 前的关键字 await 使 JavaScript 引擎等待该 promise settle，然后：

  1. 如果有 error，就会抛出异常 — 就像那里调用了 throw error 一样。
  2. 否则，就返回结果。

  3. 我们可以用 try..catch 来捕获error ```javascript function fn(){ return new Promise((resolve, reject)=>{ setTimeout(()=>{ let n = Math.floor(Math.random() * 6 + 1) if(n > 3){ resolve(n) } else { reject(new Error(‘you lose’)) }

    },1000)}) }

async function fn2(){ try{ let result = await fn() console.log(result) } catch(err){ console.log(err) }

}

fn2()

  1. <a name="0zzkB"></a>
  2. #### await后面如何接多个promise?
  3. await后接Promise.all或者Promise.race, Promise.all或Promise.race仍然是个promise
  4. ```javascript
  5. async function fn2(){
  6.   try{
  7.     let result = await Promise.all([fn(),fn(),fn()])
  8.     console.log(result)
  9.   } catch(err){
  10.     console.log(err)
  11.   }
  12. }