JavaScript设计模式 迭代器模式

一.定义

迭代器（Iterator）模式：迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示。 目前，主流浏览器都已支持Array.prototype.forEach方法，而forEach就是迭代器模式的实现。

二.实现自己的迭代器

each 函数接受 2 个参数，第一个为被循环的数组，第二个为循环中的每一步后将被触发的回调函数。

var each = function (ary, callback) {
          
   
    for (var i = 0, l = ary.length; i < l; i++) {
          
   
        callback.call(ary[i], i, ary[i]); // 把下标和元素当作参数传给 callback 函数
    }
};
each([1, 2, 3], function (i, n) {
          
   
    alert([i, n]);
});

三.内部迭代器

迭代函数的内部已经定义好了迭代规则，它完全接手整个迭代过程，外部只需要一次初始调用，就是内部迭代器。

var 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 不相等 );

四. 外部迭代器

外部迭代器必须显式地请求迭代下一个元素。

var 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 相等);
}
var iterator1 = Iterator([1, 2, 3]);
var iterator2 = Iterator([1, 2, 3]);
compare(iterator1, iterator2); // 输出：iterator1 和 iterator2 相等

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

迭代器模式不仅可以迭代数组，还可以迭代类数组的对象。比如 arguments、Map、Set、{“0”:‘a’,“1”:‘b’}等。

var each = function (obj, callback) {
          
   
    var value,
        i = 0,
        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;
};

六.总结

目前的JavaScript内置了迭代器，比如数组，类似数组对象的迭代函数forEach，map，some等等，但是还没有对象的迭代函数，根据for…in方法，我们可以自己实现对象迭代函数。 迭代器模式是一种相对简单的模式，简单到很多时候我们都不认为它是一种设计模式。 迭代器模式可以把迭代的过程从业务逻辑中分离出来，在使用迭代器模式之后，即使不关心对象的内部构造，也可以按顺序访问其中的每个元素。