javascript Promise簡(jiǎn)潔學(xué)習(xí)用法方法小結(jié)_

1、javascript Promise簡(jiǎn)潔學(xué)習(xí)用法方法小結(jié)_ 下面我就為大家?guī)?lái)一篇javascript Promise簡(jiǎn)潔學(xué)習(xí)用法方法小結(jié)。我覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。 解決回調(diào)函數(shù)嵌套太深，并行規(guī)律必需串行執(zhí)行,一個(gè)Promise代表一個(gè)異步操作的最終結(jié)果，跟Promise交互的主要方式是通過(guò)他的then()方法來(lái)注冊(cè)回調(diào)函數(shù)，去接收Promise的最終結(jié)果值 Promise相關(guān)的協(xié)議有PromiseA和PromiseA+ 定義一個(gè)類(lèi)Promise 定義屬性隊(duì)列queue，初始化空數(shù)組 定義屬性值value，初始化null 定義屬性狀態(tài)status，初始化“pendin

2、g”（默認(rèn)值） 定義成員方法getQueue()，返回屬性queue 定義成員方法getStatus()，返回屬性status 定義成員方法setStatus()，設(shè)置狀態(tài)，傳遞參數(shù)：status，value 推斷status為fulfilled或者rejected， 設(shè)置status屬性this.status=status 設(shè)置value屬性this.value=value | null ，假如不傳value就是null 定義凍結(jié)變量freezeObject 定義成員方法isFulfilled()，推斷當(dāng)前狀態(tài)是否是（完成） 定義成員方法isRejected()，推斷當(dāng)前狀態(tài)是否是（失敗）

3、定義成員方法isPending()，推斷當(dāng)前狀態(tài)師傅是（等待） 定義成員方法then()，傳遞參數(shù)：onFulfilled勝利的回調(diào)，onRejected失敗的回調(diào) 定義對(duì)象handler對(duì)象，屬性fulfilled，rejected兩個(gè)回調(diào)函數(shù) 定義handler對(duì)象的deferred屬性，Deferred對(duì)象 推斷當(dāng)前狀態(tài)是否等待，假如是等待 把handler對(duì)象塞入queue隊(duì)列數(shù)組 假如不是等待狀態(tài)，調(diào)用Utils對(duì)象的procedure()方法，參數(shù)：status， 返回 mise對(duì)象 定義一個(gè)類(lèi)Deferred 定義屬性promise，初始化

4、Promise對(duì)象 定義成員方法resolve()，傳遞參數(shù)：result結(jié)果 推斷Promise對(duì)象的狀態(tài)是 等待，挺直返回 調(diào)用Promise對(duì)象的getQueue()方法，獵取queue數(shù)組 循環(huán)數(shù)組 /todo調(diào)用工具類(lèi)Utils. procedure()方法，參數(shù)：“fulfilled”，元素，err信息 調(diào)用Promise對(duì)象的setStatus()方法，設(shè)置狀態(tài)，參數(shù)：fulfilled，result 定義成員方法reject，傳遞參數(shù)：err錯(cuò)誤信息 推斷Promise對(duì)象的狀態(tài)是 等待，挺直返回 調(diào)用Promise對(duì)象的getQueue()方法，獵取queue數(shù)組 循環(huán)數(shù)組

5、/todo，調(diào)用工具類(lèi)Utils. procedure()方法，參數(shù)：“rejected”，元素，err信息 調(diào)用Promise對(duì)象的setStatus()方法，設(shè)置狀態(tài)，參數(shù)：fulfilled，result 定義工具類(lèi)Utils，用法匿名函數(shù)立刻執(zhí)行，得到一個(gè)對(duì)象 返回對(duì)象，對(duì)象中有一個(gè)方法procedure() 定義procedure()方法，傳遞參數(shù)：type狀態(tài)類(lèi)型，handler處理器數(shù)組，result結(jié)果 獵取處處理函數(shù)func，在handlertype 到這里我看暈了。 用法方法： 定義一個(gè)函數(shù)ajax，傳遞參數(shù)：url路徑 獵取Deferred對(duì)象，new出來(lái) ajax懇求數(shù)

6、據(jù)的代碼，在返回?cái)?shù)據(jù)的回調(diào)方法中 假如勝利了調(diào)用Deferred對(duì)象的resolve()方法，參數(shù)：返回的數(shù)據(jù) 假如失敗了調(diào)用Deferred對(duì)象的reject()方法，參數(shù)：返回的數(shù)據(jù) 返回Dmise對(duì)象 調(diào)用ajax()方法，得到promise對(duì)象，參數(shù)：url， 調(diào)用promise對(duì)象的then()方法，參數(shù)：匿名函數(shù) 調(diào)用ajax()方法，獵取到promise對(duì)象，返回這個(gè)對(duì)象 形成鏈?zhǔn)秸{(diào)用 js部分： script /Promise代碼部分（我選擇狗帶） Promise = function() this.queue = ; this.value = null;

7、 this.status = pending;/ pending fulfilled rejected ; Ptotype.getQueue = function() return this.queue; ; Ptotype.getStatus = function() return this.status; ; Ptotype.setStatus = function(s, value) if (s = fulfilled | s = rejected) this.status = s; this.value = value | n

8、ull; this.queue = ; var freezeObject = Object.freeze | function(); freezeObject(this);/ promise的狀態(tài)是不行逆的 else throw new Error( message: doesnt support status: + s ); ; Ptotype.isFulfilled = function() return this.status = fulfilled; ; Ptotype.isRejected = function() return this.st

9、atus = rejected; Ptotype.isPending = function() return this.status = pending; Ptotype.then = function(onFulfilled, onRejected) var handler = fulfilled: onFulfilled, rejected: onRejected ; handler.deferred = new Deferred(); if (!this.isPending() /這里允許先轉(zhuǎn)變promise狀態(tài)后添加回調(diào) ced

10、ure(this.status, handler, this.value); else this.queue.push(handler);/then may be called multiple times on the same promise;規(guī)范2.2.6 return mise;/then must return a promise;規(guī)范2.2.7 ; var utils = (function() var makeSignaler = function(deferred, type) return function(result) transi

11、tion(deferred, type, result); ; var procedure = function(type, handler, result) var func = handlertype; var def = handler.deferred; if (func) try var newResult = func(result); if (newResult typeof newResult.then = function) /thenable / 此種寫(xiě)法存在閉包涵易造成內(nèi)存泄露，我們通過(guò)高階函數(shù)解決 / newResult.then(function(data) / de

12、f.resolve(data); / , function(err) / def.reject(err); / ); /PromiseA+規(guī)范，x代表newResult，promise代表mise /If x is a promise, adopt its state 3.4: /If x is pending, promise must remain pending until x is fulfilled or rejected. /If/when x is fulfilled, fulfill promise with the same value. /If/when x

13、is rejected, reject promise with the same reason. newResult.then(makeSignaler(def, fulfilled), makeSignaler(def, rejected);/此處的本質(zhì)是利用了異步閉包 else transition(def, type, newResult); catch(err) transition(def, rejected, err); else transition(def, type, result); ; var transition = function(deferred, type,

14、result) if (type = fulfilled) deferred.resolve(result); else if (type = rejected) deferred.reject(result); else if (type != pending) throw new Error( message: doesnt support type: + type ); ; return procedure: procedure )(); Deferred = function() mise = new Promise(); ; Dtotype.re

15、solve = function(result) if (!mise.isPending() return; var queue = mise.getQueue(); for (var i = 0, len = queue.length; i len; i+) cedure(fulfilled, queuei, result); mise.setStatus(fulfilled, result); ; Dtotype.reject = function(err) if (!mise.isPe

16、nding() return; var queue = mise.getQueue(); for (var i = 0, len = queue.length; i len; i+) cedure(rejected, queuei, err); mise.setStatus(rejected, err); /*上面看不懂，分割線*/ /測(cè)試部分 ajax = function(url) var def = new Deferred(); var xhr = new XMLHttpRequest(); xhr.onreadystatechange

17、 = function() if (xhr.readyState = 4) if (xhr.status =200 xhr.status 300) | xhr.status = 304) def.resolve(xhr.responseText) else /簡(jiǎn)化ajax，沒(méi)有供應(yīng)錯(cuò)誤回調(diào) def.reject(new Error( message: xhr.status ); ; xhr.open(get, url, true); xhr.send(null); return mise; ajax(test.php?act=1).then(function(data1) console.log(data1);/處理data1 return ajax(test.php?act=2); ).then(function(data2) console.log(data2);/處理data2 return ajax(test.php?act=3); , function(err) console.error(err); ).then(function(data3) console.log(data3); alert(suc