web-dev-qa-db-fra.com

différence entre javascript foreach loop, for..in et angular forEach loop.?

Je suis nouveau dans angular angulaire. Quand je veux itérer un objet json en angulaire, j'ai utilisé javascript foreach et for..in boucles.

Plus tard, j'ai appris que angular angulaire lui-même a un angular.forEach boucle pour itérer les objets.

Comment comparer les performances de angular.forEach avec javascript for..in et foreach boucles ??

Pourquoi devrions-nous utiliser angular.forEach au lieu de javascript foreach et for..in ??

Veuillez me donner quelques exemples et les raisons de l'utiliser, ce qui montre les performances.

Merci :)

javascriptangularjsloopsforeach
21
Isetty Ravitejakumar

Angular forEach - Appelle la fonction itérateur une fois pour chaque élément de la collection obj, qui peut être un objet ou un tableau.

var values = {name: 'misko', gender: 'male'};
angular.forEach(values, function(value, key) {
  console.log(key + ': ' + value);
});

// Output:
// "name: misko"
// "gender: male"

for..in - itère sur le enumerable properties d'un objet, dans un ordre arbitraire. Pour chaque propriété distincte, des instructions peuvent être exécutées.

var obj = {a:1, b:2, c:3};

for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}

// Output:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

forEach - la méthode exécute une fonction fournie une fois par élément de tableau.

// Notice that index 2 is skipped since there is no item at
// that position in the array.
[2, 5, , 9].forEach(function (element, index, array) {
  console.log('a[' + index + '] = ' + element);
});
// logs:
// a[0] = 2
// a[1] = 5
// a[3] = 9

En termes de performances, cela dépend de la structure de données avec laquelle vous travaillez, s'il s'agit d'un Array je vous suggérerai d'utiliser Angular.forEach or native forEach, s'il s'agit d'un Objectfor..in sera le meilleur, mais il semble Angular.forEach gère aussi très bien l'objet. Selon la quantité de données avec laquelle vous travaillez. Si c'est énorme, je vous suggère d'utiliser des bibliothèques comme Lodash or Underscore, ils gèrent bien la manipulation des données.

20
akinjide

angular.forEach est essentiellement un polyfill.

Par conséquent, si vous utilisez angulaire, peu importe si le navigateur est plus ancien car angular fournira un remplacement si nécessaire).

En code, cela ressemblerait à ceci:

if (!Array.prototype.forEach) {
    Array.prototype.forEach = function(...) {
        // angulars own implementation
    }
}

Il existe d'autres différences, par exemple.

  • angular.forEach prend en charge l'itération sur les objets;
  • angular.forEach prend un objet/tableau comme premier argument.
9
chriskelly