Heim  >  Artikel  >  Web-Frontend  >  Anleitung zum Implementieren eines JavaScript-Iteratormusters und ausführliche Erläuterung von Anwendungsbeispielen

Anleitung zum Implementieren eines JavaScript-Iteratormusters und ausführliche Erläuterung von Anwendungsbeispielen

伊谢尔伦
伊谢尔伦Original
2017-07-24 14:20:441657Durchsuche

Das Iteratormuster bezieht sich auf die Bereitstellung einer Methode für den sequentiellen Zugriff auf die einzelnen Elemente in einem Aggregatobjekt, ohne die interne Darstellung des Objekts offenzulegen.

1. Iteratoren in jQuery


$.each([1, 2, 3], function(i, n) {
  console.log("当前下标为:"+ i + " 当前元素为:"+ n );
});

2. Implementieren Sie sich selbst Iterator


var each = function(ary, callback) {
  for(var i = 0, l = ary.length; i < l; i++) {
    callback.call(ary[i], i, ary[i]);
  }  
};
each([1, 2, 3], function(i, n) {
  console.log("当前下标为:"+ i + " 当前元素为:"+ n );
});


[1, 2, 3].forEach(function(n, i, curAry){
  console.log("当前下标为:"+ i + " 当前元素为:"+ n + " 当前数组为:" + curAry);
})

3. Interner Iterator, externer Iterator

(1) Interner Iterator: Die Iterationsregeln sind definiert, er übernimmt vollständig den gesamten Iterationsprozess und erfordert nur einen ersten Aufruf von außen. Der obige Brauch ist jeweils ein interner Iterator!
(2) Externer Iterator: Die Iteration des nächsten Elements muss explizit angefordert werden.
Beispiel: Bestimmen Sie, ob zwei Arrays gleich sind

Beispiel 1: Interner Iterator


// 内部迭代器
var each = function(ary, callback) {
  for(var i = 0, l = ary.length; i < l; i++) {
    callback.call(ary[i], i, ary[i]);
  }  
};
// 比较函数
var compareAry = function(ary1, ary2) {
  if(ary1.length != ary2.length) {
    throw new Error("不相等"); // return console.log("不相等"); 
  }
  // 且住
  each(ary1, function(i, n) {
    if(n !== ary2[i]) {
      // return console.log("不相等"); 
      // return 只能返回到each方法外,后续console.log("相等")会继续执行,所以这里得使用throw
      throw new Error("不相等");
    }
  });
  console.log("相等");
}

compareAry([1, 2, 3], [1, 2, 4]);

Beispiel 2: Externer Iterator


// 外部迭代器
var Iterator = function(obj) {
  var current = 0,
    next = function() {
      current++;
    },
    isDone = function() {
      return current >= obj.length;  
    },
    getCurrentItem = function() {
      return obj[current];
    };
  return {
    next: next,
    isDone: isDone,
    getCurrentItem: getCurrentItem
  };
};
// 比较函数
var compareAry = function(iterator1, iterator2) {
  while( !iterator1.isDone() && !iterator2.isDone() ){
    if(iterator1.getCurrentItem() !== iterator2.getCurrentItem()) {
      throw new Error("不相等");
    }
    iterator1.next();
    iterator2.next();
  }
  console.log("相等");
}

compareAry(new Iterator([1, 2, 3]), new Iterator([1, 2, 4]));

4. Beendender Iterator


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

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

Das obige ist der detaillierte Inhalt vonAnleitung zum Implementieren eines JavaScript-Iteratormusters und ausführliche Erläuterung von Anwendungsbeispielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn