Promise如何解決callback hell?

廢話少說, 直接上code
  1. run()

  2. function run(){
  3.        
  4.         let step1=['1','1'];
  5.         let step2=['2','2'];
  6.         let step3=['3','3'];
  7.         let step4=['4','4'];
  8.        
  9.         Promise.all(step1.map(doStep)).then(()=>{
  10.                         console.log('step1 finish')
  11.                        
  12.                         Promise.all(step2.map(doStep)).then(()=>{
  13.                                         console.log('step2 finish')
  14.                                        
  15.                                         Promise.all(step3.map(doStep)).then(()=>{
  16.                                                         console.log('step3 finish')
  17.                                                        
  18.                                                         Promise.all(step4.map(doStep)).then(()=>{
  19.                                                                         console.log('step4 finish')
  20.                                                                        
  21.                                                                 })
  22.                                                 })
  23.                                 })
  24.                 })
  25. }
  26. function doStep(txt){
  27.         console.log(txt)
  28. }
複製代碼
其實個callback hell依然係道, 無解決過

不過依個唔係重點

重點係, 我而家開發中, 要不斷嘗試不同組合
有時可能唔要step2, 有時可能step2,3掉轉

因為依個callback hell, 我唔可以只簡單comment其中一個step, 又或者成舊step搬上搬落以改變順序

而家每改變一次組合, 要做既野多左好多, 有無辦法改善依個問題?

本帖最後由 justlazy 於 2017-4-3 18:14 編輯
  1. function run(){
  2.   const step1 = ['1','1'];
  3.   const step2 = ['2','2'];
  4.   const step3 = ['3','3'];
  5.   const step4 = ['4','4'];

  6.   return Promise.all(step1.map(doStep))
  7.     .then(() => {
  8.       console.log('step1 finished');
  9.       return Promise.all(step2.map(doStep));
  10.     })
  11.     .then(() => {
  12.       console.log('step2 finished');
  13.       return Promise.all(step3.map(doStep));
  14.     })
  15.     .then(() => {
  16.       console.log('step3 finished');
  17.       return Promise.all(step4.map(doStep));
  18.     })
  19.     .then(() => {
  20.       console.log('step4 finished');
  21.     });
  22. }

  23. function doStep(txt){
  24.   return new Promise(resolve => console.log(txt); resolve());
  25. }

  26. run().then(() => console.log('all done!'));
複製代碼

TOP

Promise.resolve(null)
.then(() => Promise.all(step1.map(doStep)))
.then((result) => console.log('step1 finished, do something...'))
.then(() => Promise.all(step2.map(doStep)))
.then((result) => console.log('step2 finished, do something...'))
...

關鍵就係你個then( ) 入面return一個新Promise,咁下一個then就係等呢個新Promise

TOP

轉用async/await

TOP

個program寫左好多, 要轉async/await就好大工程
下個program先轉了



另問Promise reject完點先可以繼續行落去?
有時某D step出左error, 咁果個Promise算係失敗左, 但一個失敗左, 其他都想繼續行落去, 但reject完就唔識行了

TOP

本帖最後由 梁炳 於 2017-4-5 13:25 編輯
個program寫左好多, 要轉async/await就好大工程
下個program先轉了



另問Promise reject完點先可以繼續行 ...
3ldk 發表於 2017-4-4 16:30



可以自己new個promise包住佢
  1. ...
  2. .then( () => {

  3.         return new Promise( (resolve, reject) =>{
  4.            doSomethingOptional()
  5.            .then(() => {
  6.               resolve("OK");
  7.            })
  8.            .catch((err) => {
  9.               resolve("OK, with error");
  10.            });
  11.         });

  12. })
  13. ...
複製代碼

TOP

個program寫左好多, 要轉async/await就好大工程
下個program先轉了



另問Promise reject完點先可以繼續行 ...
3ldk 發表於 2017-4-4 16:30


請況就同你平時throw完error都要係catch寫返點處理...

then()唔係只有一個pararmeter架! 佢仲有second parameter畀你用

TOP

相關文章