摘要:共有三種狀態(tài),相應(yīng)狀態(tài)會觸發(fā)相應(yīng)的回調(diào)函數(shù)。在函數(shù)中調(diào)用在中調(diào)用在中的返回值為一個普通值值作為的值。如果中的回調(diào)函數(shù)拋出一個錯誤,那么返回的將會成為拒絕狀態(tài),并且將拋出的錯誤作為拒絕狀態(tài)的回調(diào)函數(shù)的參數(shù)值。
用途
用于處理異步操作,避免地獄式回調(diào),比如ajax請求,處理起來更加簡單方便,代碼看起來也更容易理解,便于維護。
概念Promise 對象用于表示一個異步操作的最終狀態(tài)(完成或失敗),以及其返回的值。 Promise共有三種狀態(tài),相應(yīng)狀態(tài)會觸發(fā)相應(yīng)的回調(diào)函數(shù)。
pending: 初始狀態(tài)。什么回調(diào)函數(shù)也不觸發(fā)。
調(diào)用構(gòu)造函數(shù)如new Promise((resolve, reject) => {}),在這個exextutor函數(shù)中要么調(diào)用resolve是狀態(tài)改為完成,要么調(diào)用reject使?fàn)顟B(tài)改為失敗,要么就什么都不調(diào)用,這個時候就是pending狀態(tài),此時[[PromiseValue]]為undefined。
var result = new Promise((resolve, reject) => { })
在.then或.catch中返回值為上面直接使用構(gòu)造函數(shù)的情況,并且在其內(nèi)部也什么都不返回,那么這個時候也是pending。
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { return new Promise((resolve, reject) => { }) })
在.then或.catch中無返回值的時候,這個時候返回的狀態(tài)為前面的Promise的狀態(tài),如果前面的狀態(tài)為pending,那么這里返回的也是pending,只不過沒有返回值,返回的Promise中[[PromiseValue]]為undefined。
var result = new Promise((resolve, reject) => { }).then((res) => { })
fulfilled: 成功狀態(tài)。觸發(fā)綁定的‘onfulfilled’方法。
在executor函數(shù)中調(diào)用resolve
var result = new Promise((resolve, reject) => { resolve("xxx") })
在.then .catch中調(diào)用Promsie.resolve
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { return Promise.resolve("bbbb") })
在.then .catch中的返回值為一個普通值,值作為[[PromiseValue]]`的值。
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { return "xxxx" })
在.then或.catch中無返回值的時候,這個時候返回的狀態(tài)為前面的Promise的狀態(tài),如果前面的狀態(tài)為resolved,那么這里返回的也是resolved,只不過沒有返回值,返回的Promise中[[PromiseValue]]為undefined。
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { })
rejected: 失敗狀態(tài)。觸發(fā)綁定的‘onrejected’方法。
在executor函數(shù)中調(diào)用rejecte
var result = new Promise((resolve, reject) => { reject("xxx") })
在.then .catch中調(diào)用Promsie.reject
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { return Promise.reject("bbbb") })
在.then .catch中拋出一個錯誤時,狀態(tài)改為rejected,并且觸發(fā)onrejected函數(shù),錯誤信息將作為作為拒絕狀態(tài)的回調(diào)函數(shù)的參數(shù)值和拒絕狀態(tài)的Promise中[[PromiseValue]]的值。
var result = new Promise((resolve, reject) => { resolve("xxx") }).then((res) => { throw "xxxx" }).catch((err) => { console.log(err) // xxxx }) console.log(result) // {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "xxxx"}.then
p.then(onFulfilled, onRejected);
當(dāng)狀態(tài)變成成功狀態(tài)的時候調(diào)用onFulfilled, 當(dāng)狀態(tài)變成失敗的時候,調(diào)用onRejected。它返回一個Promise,而它的行為與then中的回調(diào)函數(shù)的返回值有關(guān):
如果then中的回調(diào)函數(shù)返回一個值,那么then返回的Promise將會成為接受狀態(tài),并且將返回的值作為接受狀態(tài)的回調(diào)函數(shù)的參數(shù)值。
如果then中的回調(diào)函數(shù)拋出一個錯誤,那么then返回的Promise將會成為拒絕狀態(tài),并且將拋出的錯誤作為拒絕狀態(tài)的回調(diào)函數(shù)的參數(shù)值。
如果then中的回調(diào)函數(shù)返回一個已經(jīng)是接受狀態(tài)的Promise,那么then返回的Promise也會成為接受狀態(tài),并且將那個Promise的接受狀態(tài)的回調(diào)函數(shù)的參數(shù)值作為該被返回的Promise的接受狀態(tài)回調(diào)函數(shù)的參數(shù)值。
如果then中的回調(diào)函數(shù)返回一個已經(jīng)是拒絕狀態(tài)的Promise,那么then返回的Promise也會成為拒絕狀態(tài),并且將那個Promise的拒絕狀態(tài)的回調(diào)函數(shù)的參數(shù)值作為該被返回的Promise的拒絕狀態(tài)回調(diào)函數(shù)的參數(shù)值。
如果then中的回調(diào)函數(shù)返回一個未定狀態(tài)(pending)的Promise,那么then返回Promise的狀態(tài)也是未定的,并且它的終態(tài)與那個Promise的終態(tài)相同;同時,它變?yōu)榻K態(tài)時調(diào)用的回調(diào)函數(shù)參數(shù)與那個Promise變?yōu)榻K態(tài)時的回調(diào)函數(shù)的參數(shù)是相同的。
Promise.resolve參數(shù)可以是三種參數(shù)類型
Promise.resolve(value);
Promise.resolve(promise);
Promise.resolve(thenable);
如果參數(shù)類型是普通的值那么返回的Promise狀態(tài)仍然是resolve,值為返回的值,如果返回值是另外兩種情況,那么返回的Promise的狀態(tài)由返回值來決定。例如下面的例子返回的是reject,值為xxxx
var result = Promise.resolve(new Promise((resolve, reject) => { reject("xxxx") }))Promise.reject
接收一個參數(shù),但是參數(shù)不會影響返回的Promise結(jié)果,通過Promise.reject返回的狀態(tài)始終都是reject。
Promise.all當(dāng)我們需要并行執(zhí)行多個異步的時候,就可以使用這個方法,該方法接收一個可以迭代的對象,例如數(shù)組,數(shù)組中一般都是我們需要并行運行的Promise對象,如果是普通值那么也會直接返回。只有每一項都為resolve時,才會調(diào)用.then中的成功方法,并且回調(diào)參數(shù)值一個包含前面所有結(jié)果的數(shù)組,并且順序也和前面一樣,否則調(diào)用失敗的回調(diào)。看個例子
var a = 1 var b = new Promise((resolve, reject) => { setTimeout(function(){ resolve("xxxx") }, 1000) }) var c = Promise.resolve("aaa") var result = Promise.all([a, b, c]).then((values) => { console.log(values) // 1, xxx, aaa }).catch((err) => { console.log(err) })
對于Promise.all的同步或者異步,如果值是空的可迭代對象,那么將是同步的,其他情況均為異步。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/98903.html
摘要:的翻譯文檔由的維護很多人說,阮老師已經(jīng)有一本關(guān)于的書了入門,覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中,顯得越來越重要。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。 JavaScript Promise 迷你書(中文版) 超詳細(xì)介紹promise的gitbook,看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。異步編程入門的全稱是前端經(jīng)典面試題從輸入到頁面加載發(fā)生了什么這是一篇開發(fā)的科普類文章,涉及到優(yōu)化等多個方面。 TypeScript 入門教程 從 JavaScript 程序員的角度總結(jié)思考,循序漸進的理解 TypeScript。 網(wǎng)絡(luò)基礎(chǔ)知識之 HTTP 協(xié)議 詳細(xì)介紹 HTT...
摘要:忍者級別的函數(shù)操作對于什么是匿名函數(shù),這里就不做過多介紹了。我們需要知道的是,對于而言,匿名函數(shù)是一個很重要且具有邏輯性的特性。通常,匿名函數(shù)的使用情況是創(chuàng)建一個供以后使用的函數(shù)。 JS 中的遞歸 遞歸, 遞歸基礎(chǔ), 斐波那契數(shù)列, 使用遞歸方式深拷貝, 自定義事件添加 這一次,徹底弄懂 JavaScript 執(zhí)行機制 本文的目的就是要保證你徹底弄懂javascript的執(zhí)行機制,如果...
摘要:實例生成以后,用方法分別指定狀態(tài)和狀態(tài)的回調(diào)函數(shù)。則是或的別名,用于指定發(fā)生錯誤時的回調(diào)函數(shù)。上述代碼也可以理解成這樣處理和前一個回調(diào)函數(shù)運行時發(fā)生的錯誤發(fā)生錯誤方法用于指定不管對象最后狀態(tài)如何,都會執(zhí)行的回調(diào)函數(shù)。 什么是promise? Promise(承諾),在程序中的意思就是承諾我過一段時間(通常是一個異步操作)后會給你一個結(jié)果,是異步編程的一種解決方案。從語法上說,原生Pro...
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。寫一個符合規(guī)范并可配合使用的寫一個符合規(guī)范并可配合使用的理解的工作原理采用回調(diào)函數(shù)來處理異步編程。 JavaScript怎么使用循環(huán)代替(異步)遞歸 問題描述 在開發(fā)過程中,遇到一個需求:在系統(tǒng)初始化時通過http獲取一個第三方服務(wù)器端的列表,第三方服務(wù)器提供了一個接口,可通過...
閱讀 1010·2023-04-25 14:45
閱讀 2790·2021-09-30 09:59
閱讀 3132·2021-09-22 15:48
閱讀 2432·2019-08-30 15:55
閱讀 3485·2019-08-30 15:44
閱讀 551·2019-08-29 14:07
閱讀 3420·2019-08-26 13:45
閱讀 546·2019-08-26 11:31