Promise的基本用法

yingzai發表於2018-01-17
Promise

Promise是一個類，可以建立一個例項, Promise，也是一個物件，用來傳遞非同步操作的訊息。
Promise有三個狀態：

penging(物件的初始狀態，等到任務的完成或者被拒絕)
fulfilled (任務執行完成並且成功的狀態)
rejuce(任務執行完成並且失敗的狀態)

Promise物件有以下兩個特點:

1)物件的狀態不受外界影響。
2) 一旦狀態改變，就不會再變， Promise的狀態只可能從“pending”狀態轉到“fulfilled”狀態或者“pejected”狀態，而且不能逆向轉換.
缺點：
1)無法取消 Promise，一旦新建它就會立即執行，無法中途取消。
2)如果不設定回撥函式，Promise 內部丟擲的錯誤，不會反應到外部。
Promise的用法
Promise的建構函式接收一個引數，是函式，並且傳入兩個引數：resolve，reject，
分別表示非同步操作執行成功後的回撥函式和非同步操作執行失敗後的回撥函式。

var promise = new Promise(function(resolve, reject) {

    if (/* 非同步操作成功 */){
        resolve(value);
    } else {
        reject(error);
    }
});
//then裡面的函式就跟我們平時的回撥函式,不管上面的是什麼結果，都會走then裡面。
promise .then(function (value){
    console.log('成功',value);
},function(reason){
    console.log('失敗',reason);
})
複製程式碼

Promise還提供了all，race、reject、resolve等方法
promise鏈式呼叫：會將前一個then的返回值（return）作為下一次成功的回撥函式的引數。
promise.all方法：可以傳入多個promise ，全部執行後將結果以陣列的方式返回，如果有一個失敗了，就失敗了
promise.race方法:就是賽跑的意思。race的用法與all一樣，誰的時間快就實行哪個函式
下面就是的小例子（字串的倒敘），來講解promise.all方法和promise.race方法

let p1 =new Promise(function (resolve,reject) {
let str1 ='123456789'; //定義一個字串
let leg = str1.length; //獲取字串的長度
let re =''; //儲存返回值
let i =1; //初始迴圈變數
let a = setInterval(function () { //定義一個定時器
re+= str1.charAt(leg-i); //獲取字串指定的位置的字元
i++;
if(i > leg) { //判斷迴圈變數大於指定字串長度
clearInterval(a); //結束定時器
if (i == leg +1) { //判斷迴圈變數 剛好大於指定字元長度時 返回 倒敘字串
resolve(re);
}else {
reject('倒敘失敗！');
}
}
},100);
});

let p2 =new Promise(function (resolve,reject) {
let str1 ='abcdefghijklmn';//定義一個字串
let leg = str1.length;//獲取字串的長度
let re ='';//儲存返回值
let i =1;//初始迴圈變數
let a1 = setInterval(function () {//定義一個定時器
re+= str1.charAt(leg-i);//獲取字串指定的位置的字元
i++;
if(i > leg){//判斷迴圈變數大於指定字串長度
clearInterval(a1);//結束定時器
if(i == leg+1){//判斷迴圈變數 剛好大於指定字元長度時 返回 倒敘字串
resolve(re);
}else {
reject('倒敘失敗2！');
}
}
},100);
});
Promise.all([p1,p2]).then(function (value) {
console.log(value);/
},function(reason){
console.log(reason);
})
Promise.race([p1,p2]).then(function (value) {
console.log(value);
},function(reason){
console.log(reason);
})
複製程式碼

Promise.resolve方法返回的是一個成功態的Promise例項

Promise.reject方法返回的是一個失敗態的Promise例項

以上就是Promise的基本用法

擴充套件：

Promise/A+完整實現



相關文章