摘要:極簡版滿足的使用方式生成實例對象的方式通過類直接調(diào)用靜態(tài)方法,目前靜態(tài)方法僅支持親測使用,歡迎指教,互相學(xué)習(xí),鏈接,歡迎。附贈利用構(gòu)造函數(shù)手寫的方法,鏈接。
極簡版Promise 滿足的使用方式
生成實例對象的方式:new MyPromise()
通過類直接調(diào)用靜態(tài)方法:MyPromise.resolve(),目前靜態(tài)方法僅支持resolve & reject
親測使用OK,歡迎指教,互相學(xué)習(xí),github鏈接,歡迎star。
附贈利用構(gòu)造函數(shù)手寫Promise 的方法,github鏈接。
class MyPromise { constructor(fn) { // 定義Promise 三種狀態(tài) this.states = { PENDING: "PENDING", RESOLVED: "RESOLVED", REJECTED: "REJECTED" } // 定義傳遞到then的value this.value = null // 定義當(dāng)前Promise運行狀態(tài) this.state = this.states.PENDING // 定義Promise失敗狀態(tài)的回調(diào)函數(shù)集合 this.resolvedCallBacks = [] // 定義Promise成功狀態(tài)的回調(diào)函數(shù)集合 this.rejectedCallBacks = [] // 為靜態(tài)方法定義其內(nèi)部使用的指向?qū)嵗膖hat MyPromise.that = this try { // 執(zhí)行 new MyPromise() 內(nèi)傳入的方法 fn(MyPromise.resolve, MyPromise.reject) } catch (error) { MyPromise.reject(this.value) } } // 靜態(tài)resolve方法,MyPromise實例不可訪問; //支持類MyPromise訪問,例:MyPromise.resolve("success").then(e=>e) static resolve(value) { // 由于靜態(tài)方法內(nèi)部的this指向 類 而不是 實例,所以用下面的方法訪問實例對象 const that = MyPromise.that // 判斷是否是MyPromise實例訪問resolve const f = that instanceof MyPromise // MyPromise實例對象訪問resolve if (f && that.state == that.states.PENDING) { that.state = that.states.RESOLVED that.value = value that.resolvedCallBacks.map(cb => (that.value = cb(that.value))) } // MyPromise類訪問resolve if (!f) { const obj = new MyPromise() return Object.assign(obj, { state: obj.states.RESOLVED, value }) } } // 靜態(tài)reject方法,MyPromise實例不可訪問; //支持類MyPromise訪問,例:MyPromise.reject("fail").then(e=>e) static reject(value) { const that = MyPromise.that const f = that instanceof MyPromise if (f && that.state == that.states.PENDING) { that.state = that.states.REJECTED that.value = value that.rejectedCallBacks.map(cb => (that.value = cb(that.value))) } if (!f) { const obj = new MyPromise() return Object.assign(obj, { state: obj.states.REJECTED, value }) } } // 定義在MyPromise原型上的then方法 then(onFulfilled, onRejected) { const { PENDING, RESOLVED, REJECTED } = this.states const f = typeof onFulfilled == "function" ? onFulfilled : c => c; const r = typeof onRejected == "function" ? onRejected : c => { throw c; }; switch (this.state) { case PENDING: // ‘PENDING’狀態(tài)下向回調(diào)函數(shù)集合添加callback this.resolvedCallBacks.push(f) this.rejectedCallBacks.push(r) break; case RESOLVED: // 將回調(diào)函數(shù)的返回值賦值給 實例的 value,滿足鏈?zhǔn)秸{(diào)用then方法時傳遞value this.value = f(this.value) break; case REJECTED: // 同上 this.value = r(this.value) break; default: break; } // 滿足鏈?zhǔn)秸{(diào)用then,返回MyPromise實例對象 return this } } MyPromise.resolve("success").then((e) => { console.log(e); return e + 1 }).then( res=> { console.log(res); }) new MyPromise(resolve => { setTimeout(() => { resolve(1); }, 2000); }) .then(res1 => { console.log(res1); return 2; }) .then(res2 => console.log(res2 ));
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/102820.html
摘要:帶你搭一個的我的目的是做一個十分簡易的管理系統(tǒng),這就得有頁面,下面我繼續(xù)來講講我是怎么快速搭一個管理系統(tǒng)的。由于是簡易版,我的目的是能夠快速搭建,而不在于代碼的規(guī)范性。我們現(xiàn)在希望把記錄塞到一個管理頁面上展示起來。 前言 只有光頭才能變強。 文本已收錄至我的GitHub倉庫,歡迎Star:https://github.com/ZhongFuCheng3y/3y 在上一篇中已經(jīng)講解了如...
摘要:大家對計時器應(yīng)該不陌生,我們在制定一個計劃時,經(jīng)常喜歡設(shè)置一個倒計時來規(guī)定完成時限,等到計時結(jié)束,它還會報警提示,今天,我就用語言編寫一個簡易的倒計時計時器。 ...
摘要:但今年不能老送同樣的東西啊,那就給大家送上幾棵圣誕樹吧。極簡版這個可算是最簡單的圣誕樹了。例如上面這棵圣誕樹,每一個樹枝又是一個小的圣誕樹。這與編程中的遞歸思想很像頂部五角星略過炫彩版一般圣誕樹上都會掛上的小彩燈。 今天是圣誕節(jié),先祝大家圣誕快樂! 有人要說了,圣誕節(jié)是耶穌誕生的日子,我又不信基督教,有啥好慶祝的。這你就有所不知了,Python 的誕生也跟圣誕節(jié)有關(guān):1989 年,那是...
摘要:最近研究了一下的實現(xiàn),這篇文章使用了十幾行代碼實現(xiàn)了一個簡單的以便幫助讀者對有更深的了解。另外一個有三種狀態(tài)。所以我們有以下的代碼然后我們實現(xiàn)函數(shù)每次函數(shù)的執(zhí)行會返回一個新的。因為這行代碼是異步執(zhí)行的,而當(dāng)中的時,這行代碼不應(yīng)該執(zhí)行。 最近研究了一下promise的實現(xiàn),這篇文章使用了十幾行代碼實現(xiàn)了一個簡單的promise;以便幫助讀者對promise有更深的了解。本篇文章實現(xiàn)的pr...
閱讀 3720·2021-11-23 09:51
閱讀 1384·2021-11-10 14:35
閱讀 4021·2021-09-22 15:01
閱讀 1292·2021-08-19 11:12
閱讀 391·2019-08-30 15:53
閱讀 1701·2019-08-29 13:04
閱讀 3438·2019-08-29 12:52
閱讀 3069·2019-08-23 16:14