摘要:執(zhí)行的時候呢即可如何處理鏈式的且保證順序每個后面鏈一個對象該對象包含子三個屬性當父狀態(tài)改變完畢執(zhí)行完相應的的時候呢,拿到子在等待這個子狀態(tài)改變,在執(zhí)行相應的。
promise源碼分析 初級入門以及如何使用請看 阮一峰promise對象講解 先上一坨代碼,后面我們要基于這坨代碼來實現(xiàn)自定義promise 原始方法
setTimeout(function(){ var a=100; console.log(a); setTimeout(function () { var b=200; console.log(b) setTimeout(function () { var c=300; console.log(c) }, 1000); }, 1000); },1000);promise實現(xiàn)
new Promise(function (resolve, reject) { setTimeout(function () { var a=100; resolve(a); }, 1000); }).then(function (res) { console.log(res); return new Promise(function (resolve, reject) { setTimeout(function () { var b=200; resolve(b); }, 1000); }) }).then(function (res) { console.log(res); return new Promise(function (resolve, reject) { setTimeout(function () { var c=300 resolve(c); }, 1000); }) }).then(function (res) { console.log(res); } )如何讓你的promise能有此魔力
讓a,b,c的值能在then里面的回調(diào)接收到
在連續(xù)調(diào)用異步,如何確保異步函數(shù)的執(zhí)行順序
如何讓異步的value在thenable函數(shù)中拿到將resolve/reject函數(shù)和onfulfiled/onrejected放入同一個對象(promise對象)里面,resolve/reject的時候?qū)alue設(shè)置this.value=xxx。onfulfiled/onrejected執(zhí)行的時候呢,onfulfiled(this.value)即可
如何處理鏈式的promise且保證順序每個promise后面鏈一個對象該對象包含onfulfiled,onfulfiled,子promise三個屬性.
當父promise 狀態(tài)改變完畢,執(zhí)行完相應的onfulfiled/onfulfiled的時候呢,拿到子promise,在等待這個子promise狀態(tài)改變,在執(zhí)行相應的onfulfiled/onfulfiled。依次循環(huán)直到當前promise沒有子promise
最終代碼(內(nèi)涵注釋)/* 我們要滿足狀態(tài)只能三種狀態(tài):PENDING,FULFILLED,REJECTED三種狀態(tài),且狀態(tài)只能由PENDING=>FULFILLED,或者PENDING=>REJECTED */ var PENDING = 0; var FULFILLED = 1; var REJECTED = 2; /* value狀態(tài)為執(zhí)行成功事件的入?yún)ⅲ琩eferreds保存著狀態(tài)改變之后的需要處理的函數(shù)以及promise子節(jié)點,構(gòu)造函數(shù)里面應該包含這三個屬性的初始化 */ function Promise(callback) { this.status = PENDING; this.value = null; this.defferd = []; setTimeout(callback.bind(this, this.resolve.bind(this), this.reject.bind(this)), 0); } Promise.prototype = { constructor: Promise, //觸發(fā)改變promise狀態(tài)到FULFILLED resolve: function (result) { this.status = FULFILLED; this.value = result; this.done(); }, //觸發(fā)改變promise狀態(tài)到REJECTED reject: function (error) { this.status = REJECTED; this.value = error; }, //處理defferd handle: function (fn) { if (!fn) { return; } var value = this.value; var t = this.status; var p; if (t == PENDING) { this.defferd.push(fn); } else { if (t == FULFILLED && typeof fn.onfulfiled == "function") { p = fn.onfulfiled(value); } if (t == REJECTED && typeof fn.onrejected == "function") { p = fn.onrejected(value); } var promise = fn.promise; if (promise) { if (p && p.constructor == Promise) { p.defferd = promise.defferd; } else { p = this; p.defferd = promise.defferd; this.done(); } } } }, //觸發(fā)promise defferd里面需要執(zhí)行的函數(shù) done: function () { var status = this.status; if (status == PENDING) { return; } var defferd = this.defferd; for (var i = 0; i < defferd.length; i++) { this.handle(defferd[i]); } }, /*儲存then函數(shù)里面的事件 返回promise對象 defferd函數(shù)當前promise對象里面 */ then: function (success, fail) { var o = { onfulfiled: success, onrejected: fail }; var status = this.status; o.promise = new this.constructor(function () { }); if (status == PENDING) { this.defferd.push(o); } else if (status == FULFILLED || status == REJECTED) { this.handle(o); } return o.promise; } };在附上一張手繪的流程圖 參考資料
v8官方實現(xiàn)
源碼地址github
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/91619.html
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復雜性。寫一個符合規(guī)范并可配合使用的寫一個符合規(guī)范并可配合使用的理解的工作原理采用回調(diào)函數(shù)來處理異步編程。 JavaScript怎么使用循環(huán)代替(異步)遞歸 問題描述 在開發(fā)過程中,遇到一個需求:在系統(tǒng)初始化時通過http獲取一個第三方服務(wù)器端的列表,第三方服務(wù)器提供了一個接口,可通過...
摘要:當?shù)臓顟B(tài)已經(jīng)流轉(zhuǎn)時,回調(diào)函數(shù)會立即被執(zhí)行,當還處于狀態(tài)時,回調(diào)函數(shù)被推入相應隊列中等待執(zhí)行。 概覽 const PENDING = Symbol(PENDING); const FULFILLED = Symbol(FULFILLED); const REJECTED = Symbol(REJECTED); class MyPromise { constructor(fn) ...
摘要:主要邏輯本質(zhì)上還是回調(diào)函數(shù)那一套。通過的判斷完成異步和同步的區(qū)分。 主要邏輯: 本質(zhì)上還是回調(diào)函數(shù)那一套。通過_subscribers的判斷完成異步和同步的區(qū)分。通過 resolve,reject -> publish -> invokeCallback -> resolve,reject的遞歸和下一條then的parent是上一條的child來完成then鏈的流轉(zhuǎn) 同步情況...
摘要:源碼學習本篇為上一篇源碼學習的補充,主要是來介紹和方法。那個率先改變的實例的返回值,就傳遞給的回調(diào)函數(shù)。基本介紹可見阮一峰老師的書籍。的狀態(tài)由決定,分成兩種情況。只有的狀態(tài)都變成,的狀態(tài)才會變成,此時的返回值組成一個數(shù)組,傳遞給的回調(diào)函數(shù)。 Promise源碼學習(2) 本篇為上一篇源碼學習(1)的補充,主要是來介紹Promise.all()和Promise.race()方法。閑話少敘...
摘要:的翻譯文檔由的維護很多人說,阮老師已經(jīng)有一本關(guān)于的書了入門,覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中,顯得越來越重要。為了讓編程更美好,我們就需要引入來降低異步編程的復雜性。 JavaScript Promise 迷你書(中文版) 超詳細介紹promise的gitbook,看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...
閱讀 537·2021-10-19 11:45
閱讀 1346·2021-09-30 09:48
閱讀 1464·2021-08-16 10:56
閱讀 728·2021-07-26 23:38
閱讀 3207·2019-08-30 13:15
閱讀 2589·2019-08-30 12:45
閱讀 1823·2019-08-29 12:14
閱讀 2059·2019-08-26 18:42