Promise函式的使用

2022-07-04 07:06:10 字數 2221 閱讀 3356

最近在做批量列印並監控顯示列印進度的功能,用到了很多非同步函式,很多非同步函式巢狀在**函式裡面,層層巢狀,導致**可閱讀性與可維護性變得十分糟糕,而且由於都是非同步執行的函式,無法知道什麼時候能**結束,無法保證程式能安全執行,為了能解決這個問題,避免"**地獄",於是就需要用promise函式。

什麼是promise函式

1. 什麼是promise函式?

promise是乙個方案,用來解決多層**巢狀的解決方案。它現在是es6的原生物件。

2. promise函式有什麼作用?

可以把乙個多層巢狀的同步、非同步都有**的方法,給拉直為一串.then()組成的呼叫鏈。

3. promise函式能解決什麼問題?

多層巢狀的**方法中,如果同時存在同步、非同步的方法,那麼實際執行順序會混亂。不好除錯不好維護。

promise函式的使用

1.promise.prototype.then()

promise 例項具有then方法,也就是說,then方法是定義在原型物件promise.prototype上的。它的作用是為 promise 例項新增狀態改變時的**函式。前面說過,then方法的第乙個引數是resolved狀態的**函式,第二個引數(可選)是rejected狀態的**函式。

var getjson = function

(url) )

});return

promise;

};getjson("/test/getdata").then(function

(json) ,

function

(error) );

2.promise.prototype.catch()

promise.prototype.catch方法是.then(null, rejection)的別名,用於指定發生錯誤時的**函式。

getjson('/posts.json').then(function(posts) ).catch

(function(error) );

上面**中,getjson方法返回乙個 promise 物件,如果該物件狀態變為resolved,則會呼叫then方法指定的**函式;如果非同步操作丟擲錯誤,狀態就會變為rejected,就會呼叫catch方法指定的**函式,處理這個錯誤。另外,then方法指定的**函式,如果執行中丟擲錯誤,也會被catch方法捕獲。

一般來說,不要在then方法裡面定義 reject 狀態的**函式(即then的第二個引數),總是使用catch方法。

//

badpromise

.then(function(data) , function(err) );

//good

promise

.then(function(data) )

.catch

(function(err) );

上面**中,第二種寫法要好於第一種寫法,理由是第二種寫法可以捕獲前面then方法執行中的錯誤,也更接近同步的寫法(try/catch)。因此,建議總是使用catch方法,而不使用then方法的第二個引數。

跟傳統的try/catch**塊不同的是,如果沒有使用catch方法指定錯誤處理的**函式,promise 物件丟擲的錯誤不會傳遞到外層**,即不會有任何反應。

finally方法用於指定不管 promise 物件最後狀態如何,都會執行的操作。該方法是 es2018 引入標準的。

promise

.then(result =>)

.catch(error =>)

.finally(() => );

詳細參考: 阮一峰

Promise使用的心得

因為業務的關係,網頁和底層的互動很多並且很複雜,一般會巢狀好幾層,原始的ajax或者jquery的ajax寫起來巢狀太長,找問題時不容易找到切入點,因此使用es6的promise來解決ajax的多層巢狀問題。promise是抽象非同步處理物件以及對其進行各種操作的元件。promise是把類似的非同步...

promise的基本使用

promise 主要是解決非同步深層的巢狀問題 promise的基本使用 var p newpromise function resolve,reject sele return p 補充 在promise中,我們通常用 then來得到非同步任務正確的值,用.catch來得到非同步任務錯誤的結果 現...

promise物件的使用

什麼是promise promise 是非同步程式設計的一種解決方案,比傳統的解決方案 函式和事件 更合理和更強大。地獄 promise物件的兩大特點 1.物件不受外界的影響 2.一旦狀態發生改變,就不會再發生改變,任何時候都能得到這個結果。getsiginmanageheader function...