欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

關(guān)于promise和async用法以及區(qū)別詳解

 更新時(shí)間:2023年01月10日 10:26:06   作者:suoh's?Blog  
Promise是一個(gè)構(gòu)造函數(shù),我們就可以new Promise()得到一個(gè) Promise的實(shí)例,下面這篇文章主要給大家介紹了關(guān)于promise和async用法以及區(qū)別的相關(guān)資料,需要的朋友可以參考下

一、promise promise的概念

Promise 是異步編程的一種解決方案,是一個(gè)構(gòu)造函數(shù),自身有all、reject、resolve方法,原型上有then、catch等方法。

特點(diǎn):

  • 對(duì)象的狀態(tài)不受外界影響。Promise對(duì)象代表一個(gè)異步操作,有三種狀態(tài):pending(進(jìn)行中)、fulfilled(已成功)和rejected(已失?。?/li>
  • 一旦狀態(tài)改變,就不會(huì)再變,任何時(shí)候都可以得到這個(gè)結(jié)果。Promise對(duì)象的狀態(tài)改變,只有兩種可能:從pending變?yōu)閒ulfilled和從pending變?yōu)閞ejected。

一句話總結(jié):就是用來解決地域回調(diào)問題(地域回調(diào)--回調(diào)函數(shù)里面嵌套回調(diào)函數(shù))

promise使用方法

用法一:Promise構(gòu)造函數(shù)接受一個(gè)函數(shù)作為參數(shù),該函數(shù)的兩個(gè)參數(shù)分別是resolve和reject。它們是兩個(gè)函數(shù),由JavaScript引擎提供。

resolve函數(shù)的作用是,將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)?ldquo;成功”(即從Pending變?yōu)镽esolved),在異步操作成功時(shí)調(diào)用,并將異步操作的結(jié)果作為參數(shù)傳遞出去。

reject函數(shù)的作用是,將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)?ldquo;失敗”(即從Pending變?yōu)镽ejected),在異步操作失敗時(shí)調(diào)用,并將異步操作報(bào)出的錯(cuò)誤作為參數(shù)傳遞出去。

用法二:Promise.resolve() 和 Promise.reject() 可以直接被調(diào)用。有時(shí)候,當(dāng)判斷出 promise 并不需要真正執(zhí)行時(shí),我們并不需要 使用 new 創(chuàng)建 Promise 對(duì)象,而是可以直接調(diào)用 Promise.resolve() 和 Promise.reject()。

地獄回調(diào)的例子

回調(diào)地獄是為了讓我們代碼執(zhí)行順序的一種操作(解決異步),但是它會(huì)使我們的可讀性非常差。

//地獄回調(diào)
setTimeout(function () { //第一層
      console.log('小鎖'); //等3秒打印張三在執(zhí)行下一個(gè)回調(diào)函數(shù)
      setTimeout(function () { //第二層
            console.log('李四'); //等2秒打印李四在執(zhí)行下一個(gè)回調(diào)函數(shù)
            setTimeout(function () { //第三層
                  console.log('王五'); //等一秒打印王五
            }, 1000)
      }, 2000)
}, 3000)

promise解決地域回調(diào)

function resolveCallback(name, flag = true) {
      return new Promise((resolve, reject) => {
            // 處理異步任務(wù)
            setTimeout(() => {
                  if (flag) {
                        resolve(name)
                  } else {
                        reject('失敗')
                  }
            }, 1000)
      }, )
}
resolveCallback('張三').then(res => {
      console.log(res)
      return resolveCallback('李四')
}).then(res => {
      console.log(res)
      return resolveCallback('王五')
}).then(res => {
      console.log(res)
}).catch(res => { //捕捉失敗的回調(diào)結(jié)果
      console.log(res)
})

Promise.all()方法

Promise.all([ .. ]) 接受一個(gè)或多個(gè)值的數(shù)組(比如,立即值、promise、thenable)。它返回一個(gè)promise。

如果所有的值都完成,這個(gè)promise 的結(jié)果是完成;

一旦它們中的某一個(gè)被拒絕,那么這個(gè)promise 就立即被拒絕。

let p1 = resolveCallback('張三')
let p2 = resolveCallback('李四')
let p3 = resolveCallback('王五')
let p = Promise.all([p1,p2,p3]).then(res=>{
      console.log(res)
}).catch(res=>{
      console.log('失敗')
})

Promise.race 方法

Promise.race() 函數(shù)返回一個(gè) Promise,它將與第一個(gè)傳遞的 promise 相同的完成方式被完成。它可以是完成( resolves),也可以是失?。╮ejects),這要取決于第一個(gè)完成的方式是兩個(gè)中的哪個(gè)。

let p1 = resolveCallback('張三', 2)
let p2 = resolveCallback('李四', 3)
let p3 = resolveCallback('王五', 1)
let p = Promise.race([p1, p2, p3]).then(res => {
      console.log(res)
}).catch(res => {
      console.log('失敗')
})

二、async async的概念

Async/Await 代碼看起來簡潔一些,使得異步代碼看起來像同步代碼

async函數(shù)一定會(huì)返回一個(gè)promise對(duì)象。如果一個(gè)async函數(shù)的返回值看起來不是promise,那么它將會(huì)被隱式地包裝在一個(gè)promise中。

sync await是基于Promise實(shí)現(xiàn)的,可以說是改良版的Promise,它不能用于普通的回調(diào)函數(shù)。

async 函數(shù)中 return 值如何接收?

方式一:通過 promise.then形參獲取

方式二:接受函數(shù)返回值的方式是 await

await的作用

await關(guān)鍵字的作用 就是獲取 Promise中返回的內(nèi)容, 獲取的是Promise函數(shù)中resolve或者reject的值(await 作用是獲取promise.[[promiseValue]]的值)

關(guān)于await的注意點(diǎn)

(1)await 必須寫在 async 中

(2)await 后是一個(gè)promise實(shí)例對(duì)象

三、為什么async/await更好?

  • 使用async函數(shù)可以讓代碼簡潔很多
  • 不需要像Promise一樣需要then
  • 不需要寫匿名函數(shù)處理Promise的resolve的值
  • 也不需要定義多余的data變量,還避免了嵌套代碼

總結(jié)

到此這篇關(guān)于關(guān)于promise和async用法以及區(qū)別的文章就介紹到這了,更多相關(guān)promise和async用法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論