手動(dòng)實(shí)現(xiàn)簡(jiǎn)單的promise及Promise.all()记某、Promise.race()

Promise的原理

Promise其實(shí)內(nèi)部也有一個(gè)defers隊(duì)列存放事件痊夭,.then的事件就在里面,程序開始執(zhí)行的時(shí)候,.then就已經(jīng)放入下一個(gè)事件,然后后面當(dāng)異步操作完成時(shí)宾茂,resolve觸發(fā)事件隊(duì)列中的事件瓷马,便完成了一個(gè).then操作, 其實(shí)到這里我們就可以很快地想出一種解決方案跨晴,每次異步操作完成通過(guò)resolve觸發(fā)事件并將事件從事件隊(duì)列中移除欧聘,通過(guò)事件隊(duì)列中的事件的resolve使事件的觸發(fā)持續(xù)下去。

我們可以用十幾行代碼就可以實(shí)現(xiàn)這樣的邏輯端盆,實(shí)現(xiàn)一個(gè)簡(jiǎn)單的異步編程方案

function P(fn) {
 var value = null;
 var events = [];
 this.then = function(f) {
   events.push(f);
   return this;
 }
 function resolve(newValue) {
   var f = events.shift();
   f(newValue, resolve);
 }
 fn(resolve);
}

function a() {
 return new P(function(resolve) {
   console.log("get...");
   setTimeout(function() {
     console.log("get 1");
     resolve(1);
   }, 1000)
 });
}
a().then(function(value, resolve) {
 console.log("get...");
 setTimeout(function() {
   console.log("get 2");
   resolve(2);
 }, 1000)
}).then(function(value, resolve) {
   console.log(value)
})

控制臺(tái)得到如下結(jié)果:

get... 

get 1

get...

get 2
2

Promise.all()

Promise.all() 它接收一個(gè)promise對(duì)象組成的數(shù)組作為參數(shù)怀骤,并返回一個(gè)新的promise對(duì)象。

當(dāng)數(shù)組中所有的對(duì)象都resolve時(shí)焕妙,新對(duì)象狀態(tài)變?yōu)閒ulfilled蒋伦,所有對(duì)象的resolve的value依次添加組成一個(gè)新的數(shù)組,并以新的數(shù)組作為新對(duì)象resolve的value焚鹊。
當(dāng)數(shù)組中有一個(gè)對(duì)象reject時(shí)痕届,新對(duì)象狀態(tài)變?yōu)閞ejected,并以當(dāng)前對(duì)象reject的reason作為新對(duì)象reject的reason末患。

簡(jiǎn)單實(shí)現(xiàn)一個(gè):

        Promise.all = function(promises){
          if(!Array.isArray(promises)){
            throw new TypeError('You must pass array')
          }

          return new Promise(function(resolve,reject){
            var result = [],
                count = promises.length;

            function resolver(value){
                resolveAll(value)
            }

            function rejecter(reason){
              reject(reason)
            }

            function resolveAll(value){
              result.push(value)

              if(--count ==0){
                resolve(result)
              }
            }

            for(var i=0;i<promises.length;i++){
              promises[i].then(resolver,rejecter)
            }
          })
        }

Promise.race()

Promise.race() 它同樣接收一個(gè)promise對(duì)象組成的數(shù)組作為參數(shù)研叫,并返回一個(gè)新的promise對(duì)象。

與Promise.all()不同璧针,它是在數(shù)組中有一個(gè)對(duì)象(最早改變狀態(tài))resolve或reject時(shí)嚷炉,就改變自身的狀態(tài),并執(zhí)行響應(yīng)的回調(diào)探橱。

        Promise.race = function(promises){
          if(!Array.isArray(promises)){
            throw new TypeError('You must pass array')
          }

          return new Promise(function(resolve,reject){
            function resolver(value){
              resolve(value)
            }

            function rejecter(reason){
              reject(reason)
            }

            for(var i=0;i<promises.length;i++){
              promises[i].then(resolver,rejecter)
            }
          })
        }
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末申屹,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子隧膏,更是在濱河造成了極大的恐慌哗讥,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,423評(píng)論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件胞枕,死亡現(xiàn)場(chǎng)離奇詭異杆煞,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)曲稼,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,147評(píng)論 2 385
  • 文/潘曉璐 我一進(jìn)店門索绪,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人贫悄,你說(shuō)我怎么就攤上這事瑞驱。” “怎么了窄坦?”我有些...
    開封第一講書人閱讀 157,019評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵唤反,是天一觀的道長(zhǎng)凳寺。 經(jīng)常有香客問(wèn)我,道長(zhǎng)彤侍,這世上最難降的妖魔是什么肠缨? 我笑而不...
    開封第一講書人閱讀 56,443評(píng)論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮盏阶,結(jié)果婚禮上晒奕,老公的妹妹穿的比我還像新娘。我一直安慰自己名斟,他們只是感情好脑慧,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,535評(píng)論 6 385
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著砰盐,像睡著了一般闷袒。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上岩梳,一...
    開封第一講書人閱讀 49,798評(píng)論 1 290
  • 那天囊骤,我揣著相機(jī)與錄音,去河邊找鬼冀值。 笑死也物,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的池摧。 我是一名探鬼主播焦除,決...
    沈念sama閱讀 38,941評(píng)論 3 407
  • 文/蒼蘭香墨 我猛地睜開眼激况,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼作彤!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起乌逐,我...
    開封第一講書人閱讀 37,704評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤竭讳,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后浙踢,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體绢慢,經(jīng)...
    沈念sama閱讀 44,152評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,494評(píng)論 2 327
  • 正文 我和宋清朗相戀三年洛波,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了胰舆。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,629評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡蹬挤,死狀恐怖缚窿,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情焰扳,我是刑警寧澤倦零,帶...
    沈念sama閱讀 34,295評(píng)論 4 329
  • 正文 年R本政府宣布误续,位于F島的核電站,受9級(jí)特大地震影響扫茅,放射性物質(zhì)發(fā)生泄漏蹋嵌。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,901評(píng)論 3 313
  • 文/蒙蒙 一葫隙、第九天 我趴在偏房一處隱蔽的房頂上張望栽烂。 院中可真熱鬧,春花似錦恋脚、人聲如沸愕鼓。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,742評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)菇晃。三九已至,卻和暖如春蚓挤,著一層夾襖步出監(jiān)牢的瞬間磺送,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,978評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工灿意, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留估灿,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,333評(píng)論 2 360
  • 正文 我出身青樓缤剧,卻偏偏與公主長(zhǎng)得像馅袁,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子荒辕,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,499評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 本文適用的讀者 本文寫給有一定Promise使用經(jīng)驗(yàn)的人汗销,如果你還沒(méi)有使用過(guò)Promise,這篇文章可能不適合你抵窒,...
    HZ充電大喵閱讀 7,299評(píng)論 6 19
  • Promise 對(duì)象 Promise 的含義 Promise 是異步編程的一種解決方案弛针,比傳統(tǒng)的解決方案——回調(diào)函...
    neromous閱讀 8,702評(píng)論 1 56
  • 一、Promise的含義 Promise在JavaScript語(yǔ)言中早有實(shí)現(xiàn)李皇,ES6將其寫進(jìn)了語(yǔ)言標(biāo)準(zhǔn)削茁,統(tǒng)一了用法...
    Alex灌湯貓閱讀 820評(píng)論 0 2
  • 前言 本文旨在簡(jiǎn)單講解一下javascript中的Promise對(duì)象的概念,特性與簡(jiǎn)單的使用方法掉房。并在文末會(huì)附上一...
    _暮雨清秋_閱讀 2,190評(píng)論 0 3
  • “如果我媳婦這么到處跑卓囚,我就打折她的腿瘾杭。”老爸對(duì)我說(shuō)捍岳,我說(shuō)是的富寿。如果我是男人我也這么想睬隶。 2016年南到廣州,北到...
    瀞好如琳閱讀 770評(píng)論 0 0