使用同步和异步版本的JavaScript forEach循环有什么区别?

时间:2017-03-27 17:39:12

标签: javascript asynchronous synchronous

我在GitHub上遇到了这个JavaScript库:

JavaScript Sync / Async forEach - 具有有趣界面的可选异步forEach。 https://github.com/cowboy/javascript-sync-async-foreach

虽然在比较ASYNC forEach功能和标准Synchronous forEach JS时,我对它的确切做法有点困惑。

forEach.js图书馆代码

var i;
for (i = 0; i < 4 && ++i;) {
    console.log(i);            // 1 ... 4
}

console.log('last value', i);  // 4

演示

在那里看看2个演示GitHub repo它显示控制台输出与Async和Synchronous版本完全相同...

/*!
 * Sync/Async forEach
 * https://github.com/cowboy/javascript-sync-async-foreach
 *
 * Copyright (c) 2012 "Cowboy" Ben Alman
 * Licensed under the MIT license.
 * http://benalman.com/about/license/
 */

(function(exports) {

  // Iterate synchronously or asynchronously.
  exports.forEach = function(arr, eachFn, doneFn) {
    var i = -1;
    // Resolve array length to a valid (ToUint32) number.
    var len = arr.length >>> 0;

    // This IIFE is called once now, and then again, by name, for each loop
    // iteration.
    (function next(result) {
      // This flag will be set to true if `this.async` is called inside the
      // eachFn` callback.
      var async;
      // Was false returned from the `eachFn` callback or passed to the
      // `this.async` done function?
      var abort = result === false;

      // Increment counter variable and skip any indices that don't exist. This
      // allows sparse arrays to be iterated.
      do { ++i; } while (!(i in arr) && i !== len);

      // Exit if result passed to `this.async` done function or returned from
      // the `eachFn` callback was false, or when done iterating.
      if (abort || i === len) {
        // If a `doneFn` callback was specified, invoke that now. Pass in a
        // boolean value representing "not aborted" state along with the array.
        if (doneFn) {
          doneFn(!abort, arr);
        }
        return;
      }

      // Invoke the `eachFn` callback, setting `this` inside the callback to a
      // custom object that contains one method, and passing in the array item,
      // index, and the array.
      result = eachFn.call({
        // If `this.async` is called inside the `eachFn` callback, set the async
        // flag and return a function that can be used to continue iterating.
        async: function() {
          async = true;
          return next;
        }
      }, arr[i], i, arr);

      // If the async flag wasn't set, continue by calling `next` synchronously,
      // passing in the result of the `eachFn` callback.
      if (!async) {
        next(result);
      }
    }());
  };

}(typeof exports === "object" && exports || this));

同步演示

// Generic "done" callback.
function allDone(notAborted, arr) {
  console.log("done", notAborted, arr);
}

异步演示

forEach(["a", "b", "c"], function(item, index, arr) {
  console.log("each", item, index, arr);
}, allDone);
// logs:
// each a 0 ["a", "b", "c"]
// each b 1 ["a", "b", "c"]
// each c 2 ["a", "b", "c"]
// done true ["a", "b", "c"]

此处的回购还有其他几个演示https://github.com/cowboy/javascript-sync-async-foreach

在实际使用中,2之间有什么区别?

0 个答案:

没有答案