Heim > Web-Frontend > js-Tutorial > Hauptteil

js-Entwurfsmuster: Was ist das Iteratormuster? Einführung in das js-Iteratormuster

不言
Freigeben: 2018-08-17 16:17:28
Original
1728 Leute haben es durchsucht

Dieser Artikel enthält Inhalte zu js-Designmustern: Was ist das Iteratormuster? Die Einführung des js-Iterator-Modus hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen.

Was ist das Iteratormuster?

Definition : Stellt eine Methode für den sequentiellen Zugriff auf jedes Element eines Aggregatobjekts bereit, ohne die interne Darstellung des Objekts offenzulegen.

Hauptlösung: Verschiedene Möglichkeiten, das gesamte integrierte Objekt zu durchlaufen.

Verwendungszweck: Ein Aggregatobjekt durchlaufen.

So lösen Sie das Problem: Übertragen Sie die Verantwortung für den Wechsel zwischen Elementen dem Iterator und nicht dem Aggregatobjekt.

Tastencode: Schnittstelle definieren: fertig, weiter.

Vorteile des Iteratormusters: 1. Es unterstützt das Durchlaufen eines Aggregatobjekts auf unterschiedliche Weise. 2. Iteratoren vereinfachen Aggregatklassen. 3. Es können mehrere Durchläufe auf demselben Aggregat stattfinden. 4. Im Iteratormodus ist es sehr praktisch, neue Aggregatklassen und Iteratorklassen hinzuzufügen, ohne den Originalcode zu ändern.

Nachteile des Iteratormusters: Da das Iteratormuster die Verantwortlichkeiten für das Speichern von Daten und das Durchlaufen von Daten trennt, erfordert das Hinzufügen einer neuen Aggregatklasse das Hinzufügen einer neuen Iteratorklasse paarweise, was die Komplexität des Systems in gewissem Maße erhöht.

Nutzungsszenarien für Iteratormuster: 1. Greifen Sie auf den Inhalt eines Aggregatobjekts zu, ohne dessen interne Darstellung offenzulegen. 2. Es ist notwendig, mehrere Durchlaufmethoden für Aggregatobjekte bereitzustellen. 3. Stellen Sie eine einheitliche Schnittstelle zum Durchqueren verschiedener Aggregatstrukturen bereit.

Hinweis: Das Iteratormuster trennt das Durchlaufverhalten des Sammlungsobjekts und abstrahiert einen Iterator, der die Kontrolle übernimmt. Auf diese Weise wird die interne Struktur der Sammlung nicht offengelegt und die interne Struktur von Die Sammlung wird nicht offengelegt. Externer Code greift transparent auf die Daten innerhalb der Sammlung zu.

Implementieren eines internen Iterators

function each(arr, fn) {    
for (let i = 0; i < arr.length; i++) {
        fn(i, arr[i])
    }
}

each([1, 2, 3], function(i, n) {
    console.log(i) // 0 1 2
    console.log(n) // 1 2 3})
Nach dem Login kopieren

Es ist ersichtlich, dass der interne Iterator beim Aufruf sehr einfach ist. Benutzer müssen sich nicht um die Details der internen Iteratorimplementierung kümmern, aber das ist auch so die Funktion des internen Iterators. Wenn Sie beispielsweise vergleichen möchten, ob zwei Arrays gleich sind, können Sie in der Rückruffunktion nur Aufhebens machen. Der Code lautet wie folgt:

const compare = function(arr1, arr2) {
    each(arr1, function(i, n) {        
    if (arr2[i] !== n) {
            console.log(&#39;两数组不等&#39;)            
            return
        }
    })
    console.log(&#39;两数组相等&#39;)
}

const arr1 = [1, 2, 3]
const arr2 = [1, 2, 3]
compare(arr1, arr2) // 两数组相等
Nach dem Login kopieren

Implementieren Sie einen externen Iterator

const iterator = function(arr) {
  let current = 0
  const next = function() {
    current = current + 1
  }
  const done = function() {
    return current >= arr.length
  }
  const value = function() {
    return arr[current]
  }
  return {
    next,
    done,
    value,
  }
}

const arr1 = [1, 2 ,3]
const arr2 = [1, 2, 3]
const iterator1 = iterator(arr1)
const iterator2 = iterator(arr2)

const compare = function(iterator1, iterator2) {
  while (!iterator1.done() && !iterator2.done()) {
    if (iterator1.value() !== iterator2.value()) {
      console.log(&#39;两数组不等&#39;)
      return
    }
    iterator1.next() // 外部迭代器将遍历的权利转移到外部
    iterator2.next()
  }
  console.log(&#39;两数组相等&#39;)
}

compare(iterator1, iterator2)
Nach dem Login kopieren

Verwandt Empfehlungen:

JS-Entwurfsmuster: Was ist das Proxy-Muster? Einführung in das JS-Proxy-Muster

JS-Entwurfsmuster: Was ist das Strategiemuster? Einführung in das js-Strategiemuster

Das obige ist der detaillierte Inhalt vonjs-Entwurfsmuster: Was ist das Iteratormuster? Einführung in das js-Iteratormuster. 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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!