摘自《JavaScript设计模式与开发实践》

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来，在使用迭代器模式之后，即使不关心对象的内部构造，也可以按顺序访问其中的每个元素。

目前，恐怕只有在一些“古董级”的语言中才会为实现一个迭代器模式而烦恼，现在流行的大部分语言如 Java、Ruby 等都已经有了内置的迭代器实现，许多浏览器也支持JavaScript 的Array.prototype.forEach 。

jQuery 中的迭代器

迭代器模式无非就是循环访问聚合对象中的各个元素。比如 jQuery中的 $.each 函数，其中回调函数中的参数 i 为当前索引， n 为当前元素，代码如下：

$.each( [1, 2, 3], function( i, n ) {    console.log( '当前下标为： '+ i )    console.log( '当前值为:' + n )})

实现自己的迭代器

现在我们来自己实现一个 each 函数， each 函数接受 2 个参数，第一个为被循环的数组，第二个为循环中的每一步后将被触发的回调函数：

 const each = function (arr, callback) {    for (let i = 0; i < arr.length; i++) {      callback.call(arr[i], i, arr[i])    }  }  each([1, 2, 3], function (i, n) {    alert([i, n])  })

内部迭代器

内部迭代器在调用的时候非常方便，外界不用关心迭代器内部的实现，跟迭代器的交互也仅仅是一次初始调用，但这也刚好是内部迭代器的缺点。由于内部迭代器的迭代规则已经被提前规定，上面的 each 函数就无法同时迭代 2个数组了。

  const compare = function (ary1, ary2) {    if (ary1.length !== ary2.length) {      throw new Error('ary1 和 ary2 不相等')    }    each(ary1, function (i, n) {      if (n !== ary2[i]) {        throw new Error('ary1 和 ary2 不相等')      }    })    alert('ary1 和 ary2 相等')  }  compare([1, 2, 3], [1, 2, 4]) // throw new Error ( 'ary1 和 ary2 不相等' )

说实话，这个 compare 函数一点都算不上好看，我们目前能够顺利完成需求，还要感谢在 JavaScript 里可以把函数当作参数传递的特性，但在其他语言中未必就能如此幸运。

外部迭代器

外部迭代器必须显式地请求迭代下一个元素。外部迭代器增加了一些调用的复杂度，但相对也增强了迭代器的灵活性，我们可以手工控制迭代的过程或者顺序。

const Iterator = function (obj) {    let current = 0    const next = function () {      current += 1    }    const isDone = function () {      return current >= obj.length    }    const getCurrItem = function () {      return obj[current]    }    return {      next: next,      isDone: isDone,      getCurrItem: getCurrItem    }  }  // 再看看如何改写 compare 函数：  const compare = function (iterator1, iterator2) {    while (!iterator1.isDone() && !iterator2.isDone()) {      if (iterator1.getCurrItem() !== iterator2.getCurrItem()) {        throw new Error('iterator1 和 iterator2 不相等')      }      iterator1.next()      iterator2.next()    }    alert('iterator1 和 iterator2 相等')  }  const iterator1 = Iterator([1, 2, 3])  const iterator2 = Iterator([1, 2, 3])  compare(iterator1, iterator2) // 输出：iterator1 和 iterator2 相等

外部迭代器虽然调用方式相对复杂，但它的适用面更广，也能满足更多变的需求。内部迭代器和外部迭代器在实际生产中没有优劣之分，究竟使用哪个要根据需求场景而定。

迭代类数组对象和字面量对象

迭代器模式不仅可以迭代数组，还可以迭代一些类数组的对象。比如 arguments 、{"0":'a',"1":'b'} 等。 通过上面的代码可以观察到，无论是内部迭代器还是外部迭代器，只要被迭代的聚合对象拥有 length 属性而且可以用下标访问，那它就可以被迭代。

  let isArrayLike = (collection) => {    const MAX_ARRAY_INDEX = Math.pow(2, 53) - 1    let length = collection !== null && collection.length    return typeof length === 'number' && length >= 0 && length <= MAX_ARRAY_INDEX  }  $.each = function (obj, callback) {    let value    let i = 0    const length = obj.length    isArray = isArrayLike(obj)    if (isArray) { // 迭代类数组      for (; i < length; i++) {        value = callback.call(obj[i], i, obj[i])        if (value === false) {          break        }      }    } else {      for (i in obj) { // 迭代 object 对象        value = callback.call(obj[i], i, obj[i])        if (value === false) {          break        }      }    }    return obj  }

倒序迭代器

由于 GoF 中对迭代器模式的定义非常松散，所以我们可以有多种多样的迭代器实现。总的来说， 迭代器模式提供了循环访问一个聚合对象中每个元素的方法，但它没有规定我们以顺序、倒序还是中序来循环遍历聚合对象。下面我们实现一个倒序访问的迭代器：

const reverseEach = function(arr, callback) {    for(let l = arr.length; l > 0; l--) {        callback(l, arr[ l ])    }}reverseEach( [ 0, 1, 2 ], function( i, n ){    console.log( n )  // 分别输出：2, 1 ,0})

中止迭代器

迭代器可以像普通 for 循环中的 break 一样，提供一种跳出循环的方法。

if ( value === false ) {    break}

这句代码的意思是，约定如果回调函数的执行结果返回 false ，则提前终止循环。下面我们把之前的 each 函数改写一下：

const each = function (ary, callback) {    for (let i = 0, l = ary.length; i < l; i++) {      if (callback(i, ary[i]) === false) { // callback 的执行结果返回 false，提前终止迭代        break      }    }  }  each([1, 2, 3, 4, 5], function (i, n) {    if (n > 3) { // n 大于 3 的时候终止循环      return false    }    console.log(n) // 分别输出：1, 2, 3  })

原著是一个有趣的人,若有侵权,请通知删除