promise鏈式呼叫的應用

阿新 • • 發佈：2020-07-11

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
    <script type="text/javascript">
    
    function cook() {
        console.log( 
'開始做飯。');
        var p = new Promise(function(resolve, reject){ 
            setTimeout(function() {
                console.log('做飯完畢！');
                resolve('雞蛋炒飯');
            }, 1000);
        });
        return p;
    }
    
    function eat(data) {
        console.log('開始吃飯：' + data);  
         
var p = new Promise(function(resolve, reject) {
            setTimeout(function() {
                console.log('吃飯完畢!');
                resolve('一塊碗和一雙筷子');// resolve()的值會傳遞給then中function的data引數，供下一個方法使用。
            }, 2000);
        });
        //這裡的return的作用是把第一個回撥函式的返回結果作為引數,傳遞給第二個回撥函式
        return 
 p; 
    }
    function wash(data) {
        console.log('開始洗碗：' + data);
        var p = new Promise(function(resolve, reject) { 
            setTimeout(function() {
                console.log('洗碗完畢!');
                resolve('乾淨的碗筷');
            }, 2000);
        });
        return p;
}
//補充程式碼
cook().then(resolve => {
    return eat(resolve)  //第一個回撥函式完成以後，會將返回結果作為引數，傳入第二個回撥函式。所以這裡要用return返回函式去傳參。
}).then(resolve => {
    return wash(resolve);
}).then(resolve => {
    //在Promise例項生成以後，可以用then方法分別指定resolved狀態和rejected狀態的回撥函式。

//then方法執行的是resolve這個回撥，並且這個函式都接受Promise物件傳出的值作為引數。而這裡“雞蛋炒飯”就是作為引數傳遞的
    console.log(resolve);  //resolve中的值是傳遞到then方法中的引數,只有在then中通過console.log輸出傳入的引數,才可以在控制檯檢視到訊息
})
//也可以像下面這樣寫,因為這三個函式本身設定的有return才可以這樣直接寫
//下一個then的回撥函式,會等上一個then中的回撥函式執行完畢,返回promise狀態,就執行.
//首先eat,wash本身就是一個函式,所以可以直接作為then中的回到函式.
//然後eat,wash函式內部也返回了promise,所以這樣寫沒有問題.
cook()
    .then(eat)
    .then(wash);

</script>
</body>
</html>

.then 中
1.return返回一個值，將返回的值作為下一個then中回撥函式的引數值
2.如果返回的是一個promise物件，將這個Promise 接受狀態的回撥函式中引數值作為下一個then回撥函式的引數值。

.then(fn(argument){})中的匿名函式實際上就是執行例項化Promise物件中的resolve()，當resolve(argument)中有引數時，可以將引數傳給.then()中的匿名函式

這裡原理都是一樣的，就是Promise例項生成以後，可以用then方法分別指定resolved狀態和rejected狀態的回撥函式。且都會返回一個Promise例項，所以可以鏈式呼叫then方法，上一個的返回值，可以作為下一個的引數。

promise鏈式呼叫的應用

<!DOCTYPE html> <html> <head> <meta charset=\"UTF-8\"> <title></title>

P14.3-Promise終極鏈式呼叫寫法

技術標籤：最美前端# VUE【構建vue專案】 P14.3-Promise終極鏈式呼叫寫法文章目錄

Promise的鏈式呼叫和axios處理高併發

最近在專案中又遇到了一個介面的請求需要依賴另一個介面的請求結果和處理高併發的場景了，所以即興在這裡簡單總結和分享下，歡迎指正和補充。

[轉載]（基礎）Promise中then()方法使用，多次呼叫、鏈式呼叫

多次呼叫then，每次res值都是new Promise的值 const promise = new Promise((resolve, reject) => {

《javascript設計模式》學習筆記四：Javascript面向物件程式設計鏈式呼叫例項分析

本文例項講述了Javascript面向物件程式設計鏈式呼叫。分享給大家供大家參考，具體如下：

JavaScript鏈式呼叫原理與實現方法詳解

本文例項講述了JavaScript鏈式呼叫原理與實現方法。分享給大家供大家參考，具體如下：

請實現滑鼠點選頁面中中任意標籤和實現鏈式呼叫，每日刷兩題

請實現滑鼠點選頁面中中任意標籤，alert該標籤名稱(注意相容性) document.onclick = function (e) {

詳解JavaScript中的鏈式呼叫

鏈模式鏈模式是一種鏈式呼叫的方式，準確來說不屬於通常定義的設計模式範疇，但鏈式呼叫是一種非常有用的程式碼構建技巧。

js簡單實現鏈式呼叫

鏈式呼叫原理：鏈式呼叫原理就是作用域鏈；實現需要做的工作；物件方法的處理（操作方法）

C# 最簡單的鏈式呼叫例子

技術標籤：C#教程c# 鏈式呼叫，重複使用一個初始化python基礎教程操作，來達到少量c#教程程式碼表達複雜操作的目的。

詳解jQuery 鏈式呼叫

鏈式呼叫 jquery物件呼叫任何方法(除了節點關係方法)執行完後,方法都會有一個返回值,返回值就是jQuery物件自己,這個現象給我們提供了便利,可以對執行結果繼續打點呼叫jQuery的方法和屬性。即——可以使用jQuery物件

通過ref返回解決C# struct結構體鏈式呼叫的問題

通常結構體不能進行鏈式呼叫，因為返回值會建立一個新的結構體。結構體：

Promies的概念鏈式呼叫

axios基於promis的API進行封裝的 Promise主要解決了非同步操作回撥函式的多層巢狀形成回撥地獄的問題、

new Promise的鏈式操作的用法

複雜的概念先不講，我們先簡單粗暴地把Promise用一下，有個直觀感受。那麼第一個問題來了，Promise是什麼玩意呢？是一個類？物件？陣列？函式？

javascript內嵌式與外鏈式的基本應用方式

目錄內嵌式與外鏈式基本應用Script的三種書寫方式：行內式、內嵌式、外鏈式1、行內式2、內嵌式3、外鏈式javascript內嵌式與外鏈式基本應用

Java實體類實現鏈式操作例項解析

這篇文章主要介紹了Java實體類實現鏈式操作例項解析,文中通過示例程式碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

ES6 class類鏈式繼承，例項化及react super(props)原理詳解

本文例項講述了ES6 class類鏈式繼承，例項化及react super(props)原理。分享給大家供大家參考，具體如下：

C++使用模板類實現鏈式棧

本文例項為大家分享了C++使用模板類實現鏈式棧的具體程式碼，供大家參考，具體內容如下

佇列的順序儲存與鏈式儲存c語言實現

一. 佇列 1.佇列定義：只允許在表的一端進行插入，表的另一端進行刪除操作的線性表。

資料結構--線性表的鏈式儲存（3）

一、什麼是連結串列　　線性表的鏈式儲存又稱之為單鏈表，他是通過記憶體中任意一塊區域來儲存資料元素的，為了讓每一塊的元素建立邏輯關係，我們把每一塊的資料儲存單元分為兩個部分，第一個部分為資料部分，第二個

promise鏈式呼叫的應用

相關推薦