Promise

laoLiueizo 發布于2019-08-20 14:40 / 816人閱讀

摘要：上面的代碼指定了兩個回調函數，第一個回調函數完成以后，會將結果作為參數傳入到第二個回調函數。對進行處理捕捉錯誤方法其實是對的調用，用于指定發生錯誤時的回調函數。

Promise對象是一種異步編程的解決方案，比傳統的解決方案——會掉函數和事件——更合理和強大。
Promise有三種狀態：pending(進行中)、Resolved(Fulfilled,已完成)和Rejected(已失敗)；而且狀態一旦改變，就不會再發生改變，Promise對象的狀態只有兩種可能：從Pending變為Resolved和從Pending變為Rejected。只要這兩種情況發生了，狀態就凝固了，不會再變了。Promise有一些缺點，就是無法取消，一旦新建它就會執行，無法中途取消；其次如果不設置回調函數，Promise內部拋出的錯誤，不會反應到外部；第三Pending狀態時，無法得知目前進展到哪一個階段。

基本用法

Promise構造函數接受一個函數作為參數，該函數參數分別是resolve和reject方法。如果成功，則用resolve將Promise的狀態改為成功，即從Pending變為resolved;如果異步失敗，則從Pending改為rejected。

基本用法

var promise = new Promise(function(resolve, reject){
    if(/*異步操作成功*/){
        resolve(value);
    } else{
        reject(error);
    }
});
promise.then(function(value){
    //success
}, function(value){
    //failure
});

一個簡單實用的例子

function timeout(ms){
    return new Promise((resolve) => {
        setTimeout(resolve, ms);
    });
}

timeout(100).then(()=>{
    console.log("done");
})

如果用Promise對象實現Ajax操作

var getJSON = function(url){
    var promise = new Promise(function(resolve, reject){
        var client = new XMLHttpRequest();
        client.open("GET", url);
        client.onreadystatechange = handler;
        client.responseType = "json";
        client.setRequestHeader("Accept", "application/json");
        client.send();
        
        function handler(){
            if(this.status == 200){
                resolve(this.response);
            }else {
                reject(new Error(this.statusText));
            }
        }
        
        return promise;
    })
}

getJSON("/posts.json").then(function(json){
    console.log("Contents:" + json);
}, function(error){
    console.error("出錯了", error);
})

在resolve的方法參數除了正常值以為，還可以能是另一個Promise實例。

Promise的鏈式操作：Promise.prototype.then

Promise.prototype.then返回的是一個新的Promise對象，因此可以寫成鏈式的。

getJSON("/posts.json").then(function(json){
    return json.post;
}).then(function(){
    //proceed
})

上面的代碼指定了兩個回調函數，第一個回調函數完成以后，會將結果作為參數傳入到第二個回調函數。
如果第一個回調函數返回的是Promise對象，這樣后一個函數調用就將等待該Promise對象有了運行結果，才會進一步調用。

getJSON("/post/1.json").then(function(post){
    return getJSON(post.commentURL);
}).then(function(comments){
    //對comments進行處理
})

捕捉錯誤：Promise.prototype.catch方法

Promise.prototype.catch其實是對Promise.prototype.then(null, rejection)的調用，用于指定發生錯誤時的回調函數。

Promise.prototype.catch 對錯誤具有“冒泡”性質，會一直向后傳遞，直到被捕獲，也就是錯我總是被下一個catch語句捕獲。

getJSON("/post/1.json").then(function(post) {
  return getJSON(post.commentURL);
}).then(function(comments) {
  // some code
}).catch(function(error) {
  // 處理前兩個回調函數的錯誤
});

Promise.all方法

var p = Promise.all([p1,p2,p3]);

這個方法接受一個數組作為參數,p1,p2,p3都是Promise對象的實例。p的最終狀態取決于參數對象數組的狀態，上例中就是p1,p2,p3來決定的。如果這三個都是fulfilled,那么p的狀態就是fulfilled;如果p1,p2,p3中有一個是rejected,p的狀態就是rejected.那么p的狀態就是reject，會傳遞給p的回調函數。

// 生成一個Promise對象的數組
var promises = [2, 3, 5, 7, 11, 13].map(function(id){
  return getJSON("/post/" + id + ".json");
});

Promise.all(promises).then(function(posts) {
  // ...  
}).catch(function(reason){
  // ...
});

Promise.resolve方法，Promise.reject方法

將現有對象轉我Promise對象，Promise.resolve方法就起到這個作用。

var jsPromise = Promise.resolve($.ajax("/whatever.json"));

上面jQuery生成defferred對象，轉為一個新的ES6的Promise對象。
如果Promise.resolve方法的參數，不具有then方法的對象（又稱thenable對象），則返回一個新的Promise對象，且他的狀態為fulfilled.

var p = Promise.resolve("Hello");
p.then(function(s){
    console.log(s)
})
//Hello

上面生成一個新的Promise對象的實例p，它的狀態為fulfilled。
Promise.reject(reason)方法也會返回一個新的Promise實例，該實例的狀態為rejected，Promise.reject方法的參數reason,會被傳遞給實例的回調函數。

async函數

async函數是用來取代回調函數的另一種方法。只要函數之前加上async的關鍵字，就表明該函數內部有異步操作。該異步操作返回一個Promise對象，前面用await關鍵字注明。當函數執行的時候，一旦遇到await就立馬返回，等接觸到異步操作完成，再接著執行函數體內后面的語句。

async function getStockPrice(symbol, currency) {
    let price = await getStockPrice(symbol);
    return convert(price, currency);
}

函數前面加了一個async表明該函數將返回一個Promise對象，調用該函數時，遇到await關鍵字，立刻返回后面的表達式產生的Promise對象，不再執行函數體后面的語句。等getStockPrice完成，在自動回到函數體內，執行剩下的語句。

function timeout(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncValue(value) {
  await timeout(50);
  return value;
}

上面代碼中，asyncValue函數前面有async關鍵字，表明函數體內有異步操作。執行的時候，遇到await語句就會先返回，等到timeout函數執行完畢，再返回value。

GPU云服務器云服務器 promise Promise使用 promise用法中的Promise

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81820.html

Promise的幾個擴展API總結

摘要：的幾個擴展總結描述和相反，當所有的被拒絕之后，方法執行完成的決議，如果存在一個執行完成的決議，方法則執行拒絕里邊的所有實例反過來就好了執行到此執行到此描述忽略被拒絕的，只需要有一個完成的，方法就執行完成操作，如果全部的都被拒絕，方法執行拒絕 Promise的幾個擴展API總結 1. Promise.none 描述：和 Promise.all 相反，當所有的promise被拒絕之后，n...

李義 2019-08-23 15:10 評論0 收藏0
異步發展流程 —— 手寫一個符合 Promise/A+ 規范的 Promise

摘要：構造函數的實現我們在使用的時候其實是使用關鍵字創建了一個的實例，其實是一個類，即構造函數，下面來實現構造函數。 showImg(https://segmentfault.com/img/remote/1460000018998456); 閱讀原文概述 Promise 是 js 異步編程的一種解決方案，避免了回調地獄給編程帶來的麻煩，在 ES6 中成為了標準，這篇文章重點不是敘...

UnixAgain 2019-08-23 12:18 評論0 收藏0
Promise 對象的理解

摘要：使用對象的好處在于可以將異步操作以同步操作的流程表達出來，避免了層層嵌套的回調函數。對象異步操作拋出錯誤，狀態就會變為，就會調用方法指定的回調函數處理這個錯誤。 Promise 含義 Promise 是異步編程的一種解決方案，比傳統的解決方案——回調函數和事件——更合理和更強大。它由社區最早提出和實現，ES6 將其寫進了語言標準，統一了用法，原生提供了 Promise 對象。所謂 P...

church 2019-08-23 16:45 評論0 收藏0
Promise 中的三兄弟 .all(), .race(), .allSettled()

摘要：對于的來說基元函數包括組合函數的類型簽名返回情況完成如果傳入的可迭代對象為空，會同步地返回一個已完成狀態的。相反，如果是在指定的時間之后完成，剛返回結果就是一個拒絕狀態的從而觸發方法指定的回調函數。在行中，對每個小任務得到的結果進行匯總。為了保證的可讀性，本文采用意譯而非直譯。想閱讀更多優質文章請猛戳GitHub博客,一年百來篇優質文章等著你！從ES6 開始，我們大都使用的是 P...

vspiders 2019-08-26 10:45 評論0 收藏0
實現Promise

摘要：使用是極好的，它是如此有用以至于我覺得應該好好研究一下，甚至是實現一個簡易的版本。構造函數檢查參數例如是不是函數啊初始化，創建對象執行因此構造函數里面傳入的是立即被執行的。使用Promise是極好的，它是如此有用以至于我覺得應該好好研究一下Promise，甚至是實現一個簡易的版本。實現之前，我們先來看看Promise的用途：使用Promise callback hell Promi...

xcc3641 2019-08-21 10:39 評論0 收藏0
【筆記】你不知道的JS讀書筆記——Promise

摘要：寫在前面這一章的順序對于未接觸過使用過的童鞋而言略抽象了，前邊幾章主要為了說明和之前的異步方式相比有什么優勢和它能解決什么問題，后邊才詳解的設計和各種場景下如何使用。建議先了解和簡單使用過后再閱讀，效果更佳。寫在前面：Promise這一章的順序對于未接觸過使用過Promise的童鞋而言略抽象了，前邊幾章主要為了說明Promise和之前的異步方式相比有什么優勢和它能解決什么問題，后邊才...

mumumu 2019-08-22 16:44 評論0 收藏0