js design patterns : qu'est-ce que le modèle d'itérateur ? Introduction au modèle d'itérateur js

Cet article vous apporte du contenu sur les modèles de conception js : qu'est-ce que le modèle d'itérateur ? L'introduction du mode itérateur js a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère que cela vous sera utile.

Quel est le modèle d'itérateur ?

Définition  : Fournit une méthode pour accéder séquentiellement à chaque élément d'un objet agrégé sans exposer la représentation interne de l'objet.

Solution principale : Différentes manières de parcourir l'ensemble de l'objet intégré.

Quand utiliser : Traverser un objet agrégé.

Comment résoudre : Donnez la responsabilité de marcher entre les éléments à l'itérateur, et non à l'objet agrégé.

Code clé : Définir l'interface : terminé, suivant.

Avantages du modèle itérateur : 1. Il prend en charge la traversée d'un objet agrégé de différentes manières. 2. Les itérateurs simplifient les classes agrégées. 3. Il peut y avoir plusieurs parcours sur le même agrégat. 4. En mode itérateur, il est très pratique d'ajouter de nouvelles classes d'agrégation et classes d'itérateur sans modifier le code d'origine.

Inconvénients du modèle d'itérateur : Étant donné que le modèle d'itérateur sépare les responsabilités de stockage des données et de parcours des données, l'ajout d'une nouvelle classe d'agrégation nécessite l'ajout d'une nouvelle classe d'itérateur. par paires, ce qui augmente dans une certaine mesure la complexité du système.

Scénarios d'utilisation du modèle d'itérateur : 1. Accédez au contenu d'un objet agrégé sans exposer sa représentation interne. 2. Il est nécessaire de fournir plusieurs méthodes de parcours pour les objets agrégés. 3. Fournir une interface unifiée pour parcourir différentes structures d'agrégats.

Remarque : Le modèle d'itérateur sépare le comportement de traversée de l'objet de collection et résume un itérateur pour prendre en charge cela peut non seulement exposer la structure interne de la collection, mais également permettre du code externe. accède de manière transparente aux données contenues dans la collection.

Implémentation d'un itérateur interne

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})

On peut voir que l'itérateur interne est très simple lorsqu'il est appelé. L'utilisateur n'a pas besoin de se soucier des détails de l'implémentation interne de l'itérateur. , mais c'est aussi un défaut d'itération interne de l'appareil. Par exemple, si vous souhaitez comparer si deux tableaux sont égaux, vous ne pouvez faire des histoires que dans sa fonction de rappel. Le code est le suivant :

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

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

Implémenter un itérateur externe

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('两数组不等')
      return
    }
    iterator1.next() // 外部迭代器将遍历的权利转移到外部
    iterator2.next()
  }
  console.log('两数组相等')
}

compare(iterator1, iterator2)

.

Recommandations associées :

Modèles de conception js : Qu'est-ce que le modèle de proxy ? Introduction au modèle de proxy js

modèle de conception js : quel est le modèle de stratégie ? Introduction au modèle de stratégie js

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!