Heim > Web-Frontend > js-Tutorial > Hauptteil

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

伊谢尔伦
Freigeben: 2017-07-24 14:20:44
Original
1718 Leute haben es durchsucht

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 );
});
Nach dem Login kopieren

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 );
});
Nach dem Login kopieren


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

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]);
Nach dem Login kopieren

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]));
Nach dem Login kopieren

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);
});
Nach dem Login kopieren

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!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage