摘要:對(duì)象設(shè)置初始狀態(tài)默認(rèn)為等待狀態(tài)用數(shù)組來保存成功函數(shù)設(shè)置為成功狀態(tài)設(shè)置為失敗狀態(tài)調(diào)用回調(diào)函數(shù)增加方法根據(jù)狀態(tài)執(zhí)行成功失敗方法執(zhí)行成功方法執(zhí)行失敗方法將成功失敗方法保存在數(shù)組里
promise理解
promise的意思是承諾。承諾理解為某個(gè)時(shí)候一些條件滿足后,會(huì)兌現(xiàn)一件事情。
//為了方便理解我編一個(gè)小故事 //先假裝我有一個(gè)女朋友 //她承諾如果她爸媽不回來就給我就可以去幫她修電腦 否則... let promise = new Promise(function (success,fail) { //她說三秒后會(huì)告訴我今晚爸媽回不回來 let herParentBack = Math.random() > 0.5 ? true : false; setTimeout(function(){ if(herParentBack){ success("我馬上過來來幫你修你電腦"); }else{ fail("你要早點(diǎn)休息"); } },3000); }); //第一個(gè)函數(shù)接收sucess函數(shù)傳來的成功信息 //第二個(gè)函數(shù)接收fail函數(shù)傳來的失敗信息 promise.then(function (sucessMsg) { console.log(sucessMsg); },function (fail) { console.log(failMsg); }) //我馬上過來幫你修電腦
new Promise會(huì)傳入一個(gè)回調(diào)函數(shù),會(huì)伴著對(duì)象創(chuàng)建被立即調(diào)用。
這個(gè)function是承諾的主體內(nèi)容。一般我們會(huì)做一些判斷或者異步請(qǐng)求。(在這里要等女友回消息,我想好怎么回答她。)
promise.then方法在promise執(zhí)行了success或fail后會(huì)執(zhí)行對(duì)應(yīng)的成功失敗方法。 (這里理解為吧想好告訴她)
promise實(shí)現(xiàn)根據(jù)promis規(guī)范promise Promise/A
Promise設(shè)置了三個(gè)狀態(tài),"pending"、"resolved"、"rejected"。
//Promise對(duì)象設(shè)置初始狀態(tài) function Promise(callback) { var self = this; //默認(rèn)為等待狀態(tài) self.status = "pending"; self.value = undefined; self.reason = undefined; //用數(shù)組來保存成功函數(shù) self.onResolvedCallBacks = []; self.onRejectedCallbacks = []; function resolve(value){ if(self.status === "pending"){ //設(shè)置為成功狀態(tài) self.status = "resolved"; self.value = value; self.onResolvedCallBacks.forEach(item=>item(self.value)); } } function reject(reason) { if(self.status === "pending"){ //設(shè)置為失敗狀態(tài) self.status = "rejected"; self.reason = reason; self.onRejectedCallbacks.forEach(item=>item(self.reason)); } } callback(resolve,reject); //調(diào)用Promise回調(diào)函數(shù) } module.exports = Promise;
增加Promise.then方法
//根據(jù)Promise狀態(tài)執(zhí)行成功失敗方法 Promise.prototype.then = function (onFulfilled,onRejected) { let self = this; onFulfilled = typeof onFulfilled == "function"?onFulfilled:function(value){return value}; onReject = typeof onReject=="function"?onReject:function(reason){throw reason;} if(self.status === "resolved"){ return new Promise(function (resolve,reject) { try { let x = onFullFilled(self.value); if(x instanceof Promise){ x.then(resolve,reject); }else{ resolve(x); } } catch(e) { reject(e); } }) //執(zhí)行成功方法 }else if(self.status == "rejected"){ return new Promise(function (resolve,reject) { try { let x = onRejected(self.reason); if(x instanceof Promise){ x.then(resolve,reject); }else{ resolve(x); } } catch(e) { reject(e) } }) //執(zhí)行失敗方法 } if(self.status === "pending"){ return new Promise(function (reslove,reject) { self.onResolvedCallBacks.push(function () { let x = onFullFilled(self.value); if(x instanceof Promise){ x.then(resolve,reject); }else{ resolve(x); } }) self.onRejectedCallbacks.push(function () { let x = onRejected(self.reason); if(x instanceof Promise){ x.then(resolve,reject); }else{ resolve(x); } }) }) //將成功失敗方法保存在數(shù)組里 } }
Promise.all
Promise.all = all; function all(iterable) { var self = this; if (!isArray(iterable)) { return this.reject(new TypeError("must be an array")); } var len = iterable.length; var called = false; if (!len) { return this.resolve([]); } var values = new Array(len); var resolved = 0; var i = -1; var promise = new this(INTERNAL); while (++i < len) { allResolver(iterable[i], i); } return promise; function allResolver(value, i) { self.resolve(value).then(resolveFromAll, function (error) { if (!called) { called = true; doReject(promise, error); } }); function resolveFromAll(outValue) { values[i] = outValue; if (++resolved === len && !called) { called = true; doResolve(promise, values); } } } }
Promise.race
Promise.race = function(iterable) { var self = this; if (!isArray(iterable)) { return this.reject(new TypeError("must be an array")); } var len = iterable.length; var called = false; if (!len) { return this.resolve([]); } var i = -1; var promise = new this(INTERNAL); while (++i < len) { resolver(iterable[i]); } return promise; function resolver(value) { self.resolve(value).then(function (response) { if (!called) { called = true; doResolve(promise, response); } }, function (error) { if (!called) { called = true; doReject(promise, error); } }); } }
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/92448.html
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。寫一個(gè)符合規(guī)范并可配合使用的寫一個(gè)符合規(guī)范并可配合使用的理解的工作原理采用回調(diào)函數(shù)來處理異步編程。 JavaScript怎么使用循環(huán)代替(異步)遞歸 問題描述 在開發(fā)過程中,遇到一個(gè)需求:在系統(tǒng)初始化時(shí)通過http獲取一個(gè)第三方服務(wù)器端的列表,第三方服務(wù)器提供了一個(gè)接口,可通過...
摘要:的翻譯文檔由的維護(hù)很多人說,阮老師已經(jīng)有一本關(guān)于的書了入門,覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中,顯得越來越重要。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。 JavaScript Promise 迷你書(中文版) 超詳細(xì)介紹promise的gitbook,看完再不會(huì)promise...... 本書的目的是以目前還在制定中的ECMASc...
摘要:從源碼看概念與實(shí)現(xiàn)是異步編程中的重要概念,它較好地解決了異步任務(wù)中回調(diào)嵌套的問題。這些概念中有趣的地方在于,標(biāo)識(shí)狀態(tài)的變量如都是形容詞,用于傳入數(shù)據(jù)的接口如與都是動(dòng)詞,而用于傳入回調(diào)函數(shù)的接口如及則在語義上用于修飾動(dòng)詞的副詞。 從源碼看 Promise 概念與實(shí)現(xiàn) Promise 是 JS 異步編程中的重要概念,它較好地解決了異步任務(wù)中回調(diào)嵌套的問題。在沒有引入新的語言機(jī)制的前提下,這...
摘要:顯然,了解的實(shí)現(xiàn)細(xì)節(jié),可以幫助我們更好地應(yīng)用它。本文將主要根據(jù)的這篇文章,探討的實(shí)現(xiàn)細(xì)節(jié)。核心說明盡管已經(jīng)有自己的規(guī)范,但目前的各類庫,在的實(shí)現(xiàn)細(xì)節(jié)上是有差異的,部分甚至在意義上完全不同。到前面到為止,所實(shí)現(xiàn)的都是不能級(jí)聯(lián)的。 在之前的異步JavaScript與Promise一文中,我介紹了Promise以及它在異步JavaScript中的使用意義。一般來說,我們是通過各種JavaSc...
摘要:對(duì)于引擎來說,兩者獲取堆棧的方式是不同的。對(duì)于引擎來說,堆棧信息附加在了函數(shù)所返回的并在鏈中傳遞,這樣函數(shù)也能在需要的時(shí)候獲取堆棧信息。使用可以實(shí)時(shí)監(jiān)控線上應(yīng)用的錯(cuò)誤,并獲取完整的堆棧信息。 譯者按: Async/Await真的只是簡(jiǎn)單的語法糖嗎?No! 原文:Asynchronous stack traces: why await beats .then() 作者: Math...
閱讀 3021·2023-04-25 18:00
閱讀 2222·2021-11-23 10:07
閱讀 4061·2021-11-22 09:34
閱讀 1250·2021-10-08 10:05
閱讀 1572·2019-08-30 15:55
閱讀 3435·2019-08-30 11:21
閱讀 3339·2019-08-29 13:01
閱讀 1378·2019-08-26 18:26