<kbd id="afajh"><form id="afajh"></form></kbd>
<strong id="afajh"><dl id="afajh"></dl></strong>
    <del id="afajh"><form id="afajh"></form></del>
        1. <th id="afajh"><progress id="afajh"></progress></th>
          <b id="afajh"><abbr id="afajh"></abbr></b>
          <th id="afajh"><progress id="afajh"></progress></th>

          then.jsJavaScript異步回調(diào)

          聯(lián)合創(chuàng)作 · 2023-09-22 11:31

          then.js

          Another very small promise!

          能用簡(jiǎn)單優(yōu)美的方式將任何同步或異步回調(diào)函數(shù)轉(zhuǎn)換成then()鏈?zhǔn)秸{(diào)用!

          then.js不同于其它promise,它沒(méi)有resolve、也沒(méi)有reject、更沒(méi)有promise對(duì)象,所以你不再需要把異步任務(wù)封裝成promise對(duì)象。

          一個(gè)典型的promise都要封裝:

          function getFile() {
              var deferred = Q.defer();
          
              FS.readFile("foo.txt", "utf-8", function (error, text) {
                  if (error) {
                      deferred.reject(new Error(error));
                  } else {
                      deferred.resolve(text);
                  }
              });
              return deferred.promise;
          }
          
          getFile().then(successHandler[, errorHandler]);

          若要進(jìn)入下一個(gè)then鏈,上面then中的successHandler、errorHandler還得進(jìn)行如上類(lèi)似封裝,搞得挺復(fù)雜!

          then.js只有then對(duì)象,它包括then、all和fail三個(gè)方法和觸發(fā)器defer,無(wú)需封裝,直接將異步任務(wù)寫(xiě)入then()!因?yàn)閠hen、all和fail都能自動(dòng)生成下一個(gè)then對(duì)象,reject和resolve被合并為defer并注入任務(wù)函數(shù),reject和resolve合并為defer的好處是,簡(jiǎn)化代碼,還可以直接代替callback!

          then.js使用模式

          直鏈:

          then(function (defer) {
              // ....
              defer(err, ...);
          }).then(function (defer, value) {
              // ....
              defer(err, ...);
          }, function (defer, err) {
              // ....
              defer(err, ...);
          }).then(function (defer) {
              // ....
              defer(err, ...);
          }).all(function (defer, err, value) {
              // ....
              defer(err, ...);
          }).then(function (defer) {
              // ....
              defer(err, ...);
          }).fail(function (defer, err) {
              // ....
          });

          嵌套:

          then(function (defer) {
              // ....
              defer(err, ...);
          }).then(function (defer, value) {
              //第二層
              then(function (defer2) {
                  // ....
                  defer2(err, ...);
              }).then(function (defer2, value) {
                  //第三層
                  then(function (defer3) {
                      // ....
                  }).all(defer2); // 返回二層
              }).then(function (defer2) {
                  // ....
                  defer(err, ...); // 返回一層
              }).fail(defer); // 返回一層
          }).then(function (defer) {
              // ....
              defer(err, ...);
          }).fail(function (defer, err) {
              // ....
          });

          async 嵌套:

          then(function (defer) {
              // ....
              defer(err, array);
          }).then(function (defer, array) {
              then.each(array, function (next, value) {
                  // ....逐步執(zhí)行同步或異步任務(wù)
                  return next ? next() : defer();
              });
          }).then(function (defer) {
              // ....
              defer(err, ...);
          }).fail(function (defer, err) {
              // ....
          });

          then對(duì)象取代callback:

          function getFileAsync() {
              return then(function (defer) {
                  readFile(failname, defer);
              }).then(function (defer, fileContent) {
                  // 處理fileContent
                  defer(null, result);
              }).fail(function (defer, err) {
                  // 處理error
                  defer(err);
              });
          }
          
          getFileAsync().then(function (defer, file) {
              // ....
          }).fail(function(defer, err) {
              // ....
          });

          更多用法請(qǐng)參考jsGen源代碼,里面包含了一百多個(gè)then任務(wù)鏈,幾百個(gè)then對(duì)象!

          Who Used

          API

          promise模式:

          1. 入口函數(shù)then():

            var thenObj = then(function(defer) {
                // 執(zhí)行同步或異步任務(wù)
                defer(err, result1, ...);
            })
            // 入口函數(shù)返回then對(duì)象
          2. then對(duì)象的then方法:

            thenObj.then(function(defer, successResult, ...) {
                // Success Handler
                // 執(zhí)行同步或異步任務(wù)
                defer(err, result1, ...);
            }, function(defer, successResult, ...) {
                // Error Handler,可選
                // 執(zhí)行同步或異步任務(wù)
                defer(err, result1, ...);
            })
            // then方法返回新的then對(duì)象(即下一個(gè)then鏈)
          3. then對(duì)象的all方法:

            thenObj.all(function(defer, err, successResult, ...) {
                // All Handler
                // 執(zhí)行同步或異步任務(wù)
                defer(err, result1, ...);
            })
            // all方法返回新的then對(duì)象(即下一個(gè)then鏈)
          4. then對(duì)象的fail方法:

            thenObj.fail(function(defer, err) {
                // Error Handler
                // 執(zhí)行同步或異步任務(wù)
                defer(err, result1, ...);
            })
            // fail方法返回新的then對(duì)象(即下一個(gè)then鏈)
          5. 關(guān)于Error收集器

            then對(duì)象的then方法的errorHandler函數(shù)、all方法、fail方法均能收集error。其中then方法的errorHandler函數(shù)和all方法只能收集上一個(gè)then對(duì)象產(chǎn)生的error;fail方法則能收集再它之前所有then鏈產(chǎn)生的error。

          6. 關(guān)于觸發(fā)器defer

            then.js中最關(guān)鍵的就是defer,用于觸發(fā)下一個(gè)then鏈。從上面可知,入口函數(shù)、then方法、all方法、fail方法中的任務(wù)函數(shù)的第一個(gè)參數(shù)都被注入了defer方法,如果任務(wù)函數(shù)本身是一個(gè)defer方法,則不會(huì)再被注入defer方法。

            defer的第一個(gè)參數(shù)永遠(yuǎn)是error,如果error存在,則error下一個(gè)then對(duì)象的Error收集器,如果Error收集器不存在,則拋出error。

            如果異步任務(wù)的callback的第一個(gè)參數(shù)為error,即callback(error, result1, ...)的形式,則可直接用defer代替異步任務(wù)的callback。Node.js中的異步函數(shù)基本都是這種形式,then.js用起來(lái)超方便。

          7. 關(guān)于fail方法

            fail方法能捕捉在它之前的then鏈中的任何一個(gè)error。fail的優(yōu)先級(jí)低于then方法的errorHandler和all方法,即then對(duì)象不存在then方法的errorHandler和all方法時(shí)error才會(huì)進(jìn)入fail。當(dāng)then鏈的某個(gè)then對(duì)象產(chǎn)生了error時(shí),如果該then對(duì)象的下一個(gè)then對(duì)象存在Error收集器,則error進(jìn)入該Error收集器,否則error會(huì)直接進(jìn)入then鏈下游最近的fail方法,其間的then對(duì)象均會(huì)跳過(guò)。

          async模式:

          then.each(array, function (next, value, index, array) {
              // 逐步執(zhí)行同步或異步任務(wù)
              asyncTask(value, function () {
                  return next ? next() : callback();
              })
          });

          Install

          Node.js:

          npm install thenjs
          
          var then = require('thenjs');

          Browser:

          注意:then.js需要bind方法支持,IE8及以下請(qǐng)先加載es5-shim.js

          Examples

          then(function (defer) {
              // start asnys task
              // use defer as callback function
              asnycTask1(param, defer);
          }).
          then(function (defer, value1, ...) {
              // successHandler, value1, ... from asnycTask1
              asnycTask2(value1, ..., defer);
          }, function (defer, err) {
              // errorHandler, err from asnycTask1
              console.error(err);
          }).
          then(function (defer, value) {
              // successHandler, value from asnycTask2
              asnycTask3(value, defer);
          }).
          then(function (defer, value) {
              // successHandler, value from asnycTask3
              asnycTask4(value, defer);
          }).
          fail(function (defer, err) {
              // global errorHandler, err from asnycTask2 or asnycTask3
              console.error(err);
          });
          瀏覽 23
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          編輯 分享
          舉報(bào)
          評(píng)論
          圖片
          表情
          推薦
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          編輯 分享
          舉報(bào)
          <kbd id="afajh"><form id="afajh"></form></kbd>
          <strong id="afajh"><dl id="afajh"></dl></strong>
            <del id="afajh"><form id="afajh"></form></del>
                1. <th id="afajh"><progress id="afajh"></progress></th>
                  <b id="afajh"><abbr id="afajh"></abbr></b>
                  <th id="afajh"><progress id="afajh"></progress></th>
                  日逼五月天 | www.手机av | 97超碰人人 | 国产精品69毛片高清亚洲 | 性爱福利导航 |