迭代器模式

157 阅读2分钟

迭代器模式

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

实现自己的迭代器

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

var each = function (ary, callback) {
  for (let i = 0, l = ary.length; i < l; i++) {
    callback(ary[i], i);
  }
};

each([1, 2, 3, 4], function (item, i) {
  console.log(item, i);
});

内部迭代器和外部迭代器

1.内部迭代器

上面each函数属于内部迭代器,该函数的内部已经定义好了迭代规则,它完全接手整个迭代过程,外部只需要调一次初始调用。

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

2.外部迭代器

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

外部迭代器增加了一些调用的复杂度,但相对也增强了迭代器的灵活性,我们可以手工控制迭代的过程或者顺序

let Iterator = function (obj) {
  let current = 0;
  let next = function () {
    current += 1;
  };
  let isDone = function () {
    return current >= obj.length;
  };
  let getCurrItem = function () {
    return obj[current];
  };

  return {
    next,
    isDone,
    getCurrItem,
    length: obj.length,
  };
};

let compare = function (Iterator1, Iterator2) {
  if (Iterator1.length !== Iterator2.length) {
    console.log("不相等");
  }
  while (!Iterator1.isDone() && !Iterator2.isDone()) {
    if (Iterator1.getCurrItem() !== Iterator2.getCurrItem()) {
      throw new Error("不相等");
    }
    Iterator1.next();
    Iterator2.next();
  }
  console.log("相等");
};
compare(Iterator([1,2,3,4,5]),Iterator([1,2,3,4,5]))

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

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

迭代器模式不仅可以迭代数组,还可以迭代一些类数组的对象。比如arguments{"0":1,"1":2,"2":3}等。通过上面的代码可以观察到,无论是内部迭代器还是外部迭代器,只要被迭代的聚合对象拥有length属性而且可以用下标访问,那么它就可以被迭代,在JavaScript中,for...in语句可以用来迭代普通字面量对象的属性。

倒序迭代器

let reverseEach = function (ary, callback) {
  for (let l = ary.length - 1; l >= 0; l--) {
    callback && callback(l, ary[l]);
  }
};

reverseEach([1,2,3,4],(i,item)=>{
    console.log(i,item)
})

中止迭代器

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

var each = function (ary, callback) {
  for (let i = 0, l = ary.length; i < l; i++) {
    if (callback(ary[i], i) === false) {
      break;
    }
  }
};

each([1, 2, 3, 4], function (item, i) {
  if (item > 3) {
    return false;
  }
  console.log(item);
});