【Promise】ES6 Promise的使用

AlphaGooo 發布于2019-08-23 18:26 / 1746人閱讀

摘要：首先，我們為什么要用語法作為替代回調函數執行，作為異步操作的處理方法之一，是解決異步執行時候回調函數嵌套回調函數這一問題的方法，它更簡潔地控制函數執行流程一般有三種狀態等待態，成功態，失敗態常見寫法為通常，我們處理異步請求，會使用回調函數嵌

首先，我們為什么要用Promise語法？
Promise作為替代回調函數執行，作為異步操作的處理方法之一，是解決JS異步執行時候回調函數嵌套回調函數這一問題的方法，它更簡潔地控制函數執行流程

一般promise有三種狀態：pending(等待態)，fulfiled(成功態)，rejected(失敗態)；

常見寫法為：

let p = ?new Promise(resolve, reject){}.then（）；

通常，我們處理異步請求，會使用回調函數嵌套回調函數
例如：

fn("a", function(a) {
    fn1("b", function(b) {
        fn2("c", function(c) {
            fn3("d", function(d) {
                alert("回調成功，結果為："a+b+c+d")
            })
        })
    })
})

但我們發現這樣寫的代碼可讀性并不高

如果使用promise語法，則更加符合閱讀習慣，只需要在then函數中寫處理邏輯即可

new Promise(function(resolve , reject) {
    resolve(1);
}).then(function(val) {
    console.log(val);
    return new Promise(function(resolve , reject) {
        resolve(2);
    });
}).then(function(val) {
    console.log(val);
    return new Promise(function(resolve , reject) {
        resolve(3);
    });
}).then(function(val) {
    console.log(val);
    return new Promise(function(resolve , reject) {
        resolve(4);
    });
}).then(function(val) {
    console.log(val);
});

運行結果為：

接下來模擬在實際項目開發中，在異步請求完數據后處理數據的情況，我們在這里用settimeout來模擬異步請求

let mypromise = new Promise(function(resolve, reject){
    setTimeout(function(){
        resolve("成功!"); 
    }, 1000);
});
mypromise.then(function(successMessage){
    console.log(successMessage);
});

運行結果為:

我們可以看到這里的“成功！”在運行一秒后執行

常用API
(1) new Promise

new Promise(function(resolve, reject){
});

(2) PromiseObj.then(resolveFn,rejectFn)
resolveFn：Promise對象成功的回調處理函數
rejectFn：Promise對象失敗的回調處理函數

new Promise((resolve,reject)=>{

}).then((resolveData)=>{

},(rejectErr)=>{
    
})

(3) PromiseObj.catch()

new Promise((resolve,reject)=>{

}).catch(err=>{
    console.log(err)
})

（4）PromiseObj.resolve()

Promise.resolve(123).then(data=>{
    console.log(data)
})

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

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

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

ES6-7

摘要：的翻譯文檔由的維護很多人說，阮老師已經有一本關于的書了入門，覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發過程中，顯得越來越重要。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。 JavaScript Promise 迷你書（中文版）超詳細介紹promise的gitbook，看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...

mudiyouyou 2019-08-21 18:40 評論0 收藏0
通過 ES6 Promise 和 jQuery Deferred 的異同學習 Promise

摘要：和和都有和，但是略有不同。實際上返回的是一個對象。和添加的回調，添加的回調。所以在調用成功的情況下執行添加的回調，調用失敗時執行添加的回調。，產生對象并，產生對象并，然后繼續處理，的語法糖，和的差不多但不同。 Deferred 和 Promise ES6 和 jQuery 都有 Deffered 和 Promise，但是略有不同。不過它們的作用可以簡單的用兩句話來描述 Deffere...

Yujiaao 2019-08-21 10:39 評論0 收藏0
JavaScript 異步

摘要：從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。寫一個符合規范并可配合使用的寫一個符合規范并可配合使用的理解的工作原理采用回調函數來處理異步編程。 JavaScript怎么使用循環代替(異步)遞歸問題描述在開發過程中，遇到一個需求：在系統初始化時通過http獲取一個第三方服務器端的列表，第三方服務器提供了一個接口，可通過...

tuniutech 2019-08-21 18:34 評論0 收藏0
es6 - Promise

摘要：所謂異步編程中的異步是相對于同步的概念的。是一系列異步編程規范的統稱。如果中的回調函數返回一個值，那么返回的將會成為接受狀態，并且將返回的值作為接受狀態的回調函數的參數值。參考介紹基礎篇深入理解與異步編程。 es6 promise與異步編程對于一些還不具備大量編程經驗的朋友來說，promise可能是es6比較難以掌握的點。首先是很多名詞，比如Promises，es6 Promise,...

wemallshop 2019-08-22 15:11 評論0 收藏0
淺談ES6原生Promise

摘要：如果有錯誤，則到的第二個回調函數中，對錯誤進行處理。假設第一個的第一個回調沒有返回一個對象，那么第二個的調用者還是原來的對象，只不過其的值變成了第一個中第一個回調函數的返回值。 ES6標準出爐之前，一個幽靈，回調的幽靈，游蕩在JavaScript世界。正所謂：世界本沒有回調，寫的人多了，也就有了})})})})})。 Promise的興起，是因為異步方法調用中，往往會出現回調函數一...

yedf 2019-08-20 10:30 評論0 收藏0
ES6 Promise：模式與反模式

摘要：盡管可以讓代碼更加簡潔易讀，但對于只熟悉回調函數的人來說，可能對此還是會有所懷疑。始終避免在或使用回調函數，否則會吞噬任何后續的錯誤，將其作為鏈的一部分。然而，使用回調函數，使用所謂的，即第一個參數是一個錯誤回調變得很常見。原文：ES6 Promises: Patterns and Anti-Patterns作者：Bobby Brennan 當幾年前，第一次使用 NodeJS 的時候...

djfml 2019-08-21 16:49 評論0 收藏0