亚洲精品久久久中文字幕-亚洲精品久久片久久-亚洲精品久久青草-亚洲精品久久婷婷爱久久婷婷-亚洲精品久久午夜香蕉

您的位置:首頁技術文章
文章詳情頁

javascript - 關于 Promise 異步操作的疑惑,以及如果更優雅的編寫

瀏覽:80日期:2023-02-17 08:36:38

問題描述

這幾天看了翻了很多關于 「promise」相關技術貼,看的是眼花繚,一知半解大概了解其作用。

先說說問題吧,項目中用到最多少就是Ajax,有個很不爽的問題「多條ajax依賴請求」假設: R1 > R2( r1_result ) > R3( r2_result ),最省事的做法全部都同步了吧,結果就是體驗很糟糕,頁面一度假死,loading 也不轉了,使用異步操令人惡心的就是一層套一層的回調,以及后續更多的依賴操作。

生命在于折騰,于是就回到了第一段中各種翻閱,看到某位兄臺對 promise 原理刨析,下面引用這位兄臺中的code,http://malcolmyu.github.io/ma...

function Promise(fn) { var state = ’pending’; var value; var deferred = null; function resolve(newValue) { if(newValue && typeof newValue.then === ’function’) { newValue.then(resolve, reject); return; } state = ’resolved’; value = newValue; if(deferred) { handle(deferred); } } function reject(reason) { state = ’rejected’; value = reason; if(deferred) { handle(deferred); } } function handle(handler) { if(state === ’pending’) { deferred = handler; return; } var handlerCallback; if(state === ’resolved’) { handlerCallback = handler.onResolved; } else { handlerCallback = handler.onRejected; } if(!handlerCallback) { if(state === ’resolved’) {handler.resolve(value); } else {handler.reject(value); } return; } var ret = handlerCallback(value); handler.resolve(ret); } this.then = function(onResolved, onRejected) { return new Promise(function(resolve, reject) { handle({onResolved: onResolved,onRejected: onRejected,resolve: resolve,reject: reject }); }); }; fn(resolve, reject);}

看完我不禁又疑惑了, then( function(){ do... } ),這丫還不是個回調嘛,難道是折騰的意義就是套個語法糖(我不信)。

存在即合理,所以最后怎樣合理使用 promise, 如何更優雅操作ajax流程?順便提下有使用 ( axios fetch.js )感覺如何?

問題解答

回答1:

Promise 就是為了解決異步流程控的而生的,其使用核心就是then方法; then初看起來是很像回調,但then的特質是可以處理異常及鏈式寫法. 打個比方,幾個ajax請求依賴如下:

A1 -> A2; Aa -> Ab;Ab + Ac -> Ad;A2 + Ad -> Ax;

如果用Promise,代碼會很清晰 首先準備好 A1,A2,Aa,Ab,Ac,Ad,Ax 都是根據依賴反回promise對像的函數,我就不寫了 然后可以看Promise表演了:

Promise.all([ A1().then(A2), //A1 -> A2 Promise.all([Aa().then(Ab), //Aa -> AbAc() //Ac ]).then(Ad) //Ab + Ac -> Ad;]).then(Ax,Err) //A2 + Ad -> Ax.then(function(v){//完成})

A1,Aa和Ac沒有依賴,會并發執行,之后會根據依賴完成的情況來繼續, 不論哪一個Ajax出問題,都會觸發最后的Err事來統一處理錯誤; 如果你用回調來寫一下試試,要么效率不好,要么回調方法里加一堆代碼來判斷依賴的情況.

參考代碼:

//首先準備好 A1,A2,Aa,Ab,Ac,Ad,Ax 都是基于回調的異步函數var a2,ab,ac,ad; //用來保存完成情況的變量function runAx(){ if(a2 == undefined || ad == undefined) return; //判斷依賴 Ax(a2,ad,function(e,v){//完成 })}function runAd(){ if(ab == undefined || ac == undefined) return; //判斷依賴 Ad(ab,ac,function(e,v){ad = v;runAx(); })}A1(function(e,v){ A2(v,function(e,v){a2 = v;runAx(); })})Aa(function(e,v){ Ab(v,function(e,v){ab = v;runAd(); })})Ac(function(e,v){ ac = v; runAd();})

上面的代碼沒有去處理error,就這么長了,如果依賴再復雜一點,可以想象代碼量,而且容易寫錯;

回答2:

你的理解基本上對,實際上Promise沒簡化多少,只是減少了嵌套的層級。

所以,終極解決方案就是Async/Await,題主可以去查查看資料。

回答3:

優雅就是一個then接一個then,把回調圣誕樹造型擼直,這就是Promises的貢獻。

我寫程序要七八個回調嵌套,Promises爽的一比。

你覺得then寫法都嫌麻煩,那就不要用咯,用Async/Await

標簽: JavaScript
主站蜘蛛池模板: 国产精品嫩草影院在线观看免费 | 午夜影皖普通区 | 精品国产福利在线 | 在线观看扣喷水 | 国产伦精品一区二区三区网站 | 免费黄色片视频 | 国产精品东北一极毛片 | 日韩一本 | 91自产国偷拍在线 | 亚洲六月丁香色婷婷综合久久 | 国产91av在线 | 国产 欧美 日韩 在线 | 日本高清免费一本视频在线观看 | 亚洲一级片在线播放 | 一级白嫩美女毛片免费 | 欧美亚洲一区二区三区四 | 国产亚洲精品高清在线 | 亚洲日韩中文字幕一区 | 成人精品在线观看 | 色综合精品久久久久久久 | 亚洲欧美中文字幕高清在线一 | 国产剧情一区二区三区 | 成人网址大全 | 亚洲不卡免费视频 | 国产精品成人免费视频不卡 | 一级欧美 | 欧美日韩视频在线观看高清免费网站 | 黄色网址在线免费看 | 免费日比视频 | 女人被免费网站视频在线 | 在线免费黄色 | 日本久久久久久久中文字幕 | 亚洲精品在线网 | 国产免费黄色大片 | 欧美人与善交大片 | 日日噜噜夜夜狠狠久久丁香七 | 久久一二 | 国产精品三级a三级三级午夜 | 国产真实偷乱视频在线观看 | 三级毛片在线 | 美女被拍拍拍拍拍拍拍拍 |