搜尋
首頁web前端js教程ES6之Promise的學習
ES6之Promise的學習Jun 29, 2020 am 10:25 AM
es6promise


Promise開篇

因為javascript非同步機制,導致一個常見的問題,回呼金字塔:

loadImg('a.jpg', function() {
    loadImg('b.jpg', function() {
        loadImg('c.jpg', function() {
            console.log('all done!');
        });
    });
});

Promise 字面意思,承諾。如果A調用B,B返回一個承諾給A,然後A就可以寫計劃時這麼寫:當B返回結果給我的時候,A執行S1方案,反之如果B因為什麼原因沒有給A想要的結果,那麼A執行應急方案S2,這樣的話,所有潛在風險都在A的控制範圍內

var resB = B();
var runA = function(){
   resB.then(execS1,execS2);
};

如果A要完成一件事,可能依賴的不是B一個響應,那麼上面的代碼就會變成

var resB = B();
var resC = C();
...
 
var runA = function() {
    reqB
        .then(resC, execS2)
        .then(resD, execS3)
        .then(resE, execS4)
        ...
        .then(execS1);
};
 
runA();

在這裡,每當一個詢問者做出不符合預期的應答的時候都用了不同的處理機制,雖然,Promise規範沒有要求這樣做,甚至可以不做任何處理,即(不傳入then的第二個參數),或統一處理

Promise/A 規範

  • 一個Promise可能存在三種狀態:等待( pending),已完成(fulfilled),已拒絕(rejected)

  • 一個Promise的狀態只可能從"等待"轉到"完成"或"拒絕",不能逆向轉換

  • Promise必須實作then方法,(then是promise核心),而且then必須回傳一個promise,同一個promise的then可以呼叫多次,而且回呼執行的順序和它們定義的順序一樣。

  • then方法接受兩個參數,第一個參數是成功時候的回調,另一個是失敗的回調,then可以接受另一個promise傳入,也接受一個"類then"的物件或方法,也就是thenable物件

標準的Promise

可參考html5rocks的這篇文章JavaScript Promises,目前高階瀏覽器如chrome、firefox都已經內建了Promise對象,提供更多的操作接口,例如Promise.all()
,支援傳入一個promises數組,當所有promises都完成時執行then,還有就是更加友好強大的異常捕獲,應對日常的非同步編程,應該夠了。

第三方函式庫的Promise

現今流行的各大js函式庫,幾乎都不同程度的實現了Promise,如dojo,jQuery、Zepto、when.js、Q等,只是暴露出來的大都是Deferred
對象,

尾聲

我們看到,不管Promise實作怎麼複雜,但是它的用法卻很簡單,組織的程式碼很清晰,從此不用再受callback的折磨了。
最後,Promise是如此的優雅!但Promise也只是解決了回呼的深層巢狀的問題,真正簡化JavaScript非同步程式設計的還是Generator,在Node.js端,建議考慮Generator。

推薦教學:《JS教學

以上是ES6之Promise的學習的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文轉載於:简书。如有侵權,請聯絡admin@php.cn刪除
在Vue应用中遇到Uncaught (in promise) TypeError怎么办?在Vue应用中遇到Uncaught (in promise) TypeError怎么办?Jun 25, 2023 pm 06:39 PM

Vue是一款流行的前端框架,在开发应用时经常会遇到各种各样的错误和问题。其中,Uncaught(inpromise)TypeError是常见的一种错误类型。在本篇文章中,我们将探讨它的产生原因和解决方法。什么是Uncaught(inpromise)TypeError?Uncaught(inpromise)TypeError错误通常出现在

言出必行:兑现承诺的好处和坏处言出必行:兑现承诺的好处和坏处Feb 18, 2024 pm 08:06 PM

在日常生活中,我们常常会遇到承诺与兑现之间的问题。无论是在个人关系中,还是在商业交易中,承诺的兑现都是建立信任的关键。然而,承诺的利与弊也常常会引起争议。本文将探讨承诺的利与弊,并给出一些建议,如何做到言出必行。承诺的利是显而易见的。首先,承诺可以建立信任。当一个人信守承诺时,他会让别人相信自己是一个可信赖的人。信任是人与人之间建立起的纽带,它可以让人们更加

es6中怎么判断两个对象是否相等es6中怎么判断两个对象是否相等Apr 19, 2022 pm 03:34 PM

在es6中,可用Object对象的is()方法来判断两个对象是否相等,该方法检测两个变量的值是否为同一个值,判断两个对象的引用地址是否一致,语法“Object.is(对象1,对象2)”;该方法会返回布尔值,若返回true则表示两个对象相等。

深入了解Promise.resolve()深入了解Promise.resolve()Feb 18, 2024 pm 07:13 PM

Promise.resolve()详解,需要具体代码示例Promise是JavaScript中一种用于处理异步操作的机制。在实际开发中,经常需要处理一些需要按顺序执行的异步任务,而Promise.resolve()方法就是用来返回一个已经Fulfilled状态的Promise对象。Promise.resolve()是Promise类的一个静态方法,它接受一个

实例解析ES6 Promise的原理和使用实例解析ES6 Promise的原理和使用Aug 09, 2022 pm 03:49 PM

利用Promise对象,把普通函数改成返回Promise的形式,解决回调地狱的问题。明白Promise的成功失败调用逻辑,可以灵活的进行调整。理解核心知识,先用起来,慢慢整合吸收知识。

PHP 函数返回 Promise 对象有什么优势?PHP 函数返回 Promise 对象有什么优势?Apr 19, 2024 pm 05:03 PM

优势:异步和非阻塞,不阻塞主线程;提高代码可读性和可维护性;内置错误处理机制。

前端开发利器:Promise在解决异步问题中的作用与优势前端开发利器:Promise在解决异步问题中的作用与优势Feb 22, 2024 pm 01:15 PM

前端开发利器:Promise在解决异步问题中的作用与优势引言:在前端开发中,我们经常会遇到异步编程的问题。当我们需要同时执行多个异步操作或处理多个异步回调时,代码往往会变得复杂、难以维护。为了解决这样的问题,Promise应运而生。Promise是一种用于处理异步操作的编程模式,它提供了一种将异步操作以同步方式进行处理的能力,使得代码更加简洁和可读。本文将介

promise对象有哪些promise对象有哪些Nov 01, 2023 am 10:05 AM

promise对象状态有:1、pending:初始状态,既不是成功,也不是失败状态;2、fulfilled:意味着操作成功完成;3、rejected:意味着操作失败。一个Promise对象一旦完成,就会从pending状态变为fulfilled或rejected状态,且不能再改变。Promise对象在JavaScript中被广泛使用,以处理如AJAX请求、定时操作等异步操作。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前By尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SecLists

SecLists

SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),