Maison >interface Web >js tutoriel >Compréhension approfondie de la méthode forEach en javascript

Compréhension approfondie de la méthode forEach en javascript

yulia
yuliaoriginal
2018-09-14 15:22:391559parcourir

J'ai étudié JavaScript en profondeur récemment et j'ai résumé quelques points de connaissances à partager avec vous. Cet article parle principalement de la méthode forEach des tableaux en JavaScript. Les amis qui en ont besoin peuvent s'y référer et l'apprendre.

La méthode forEach exécute la fonction de rappel une fois pour chaque élément du tableau qui contient une valeur valide dans l'ordre croissant. Les éléments qui ont été supprimés (à l'aide de la méthode daleta, etc.) ou les éléments non initialisés seront ignorés. (mais pas ceux qui indiquent qu'il s'agit d'un élément non défini) ; La méthode
accepte une fonction de rappel, et la fonction de rappel accepte trois paramètres : l'élément actuel, l'index et le tableau d'opérations. La méthode

var array1 = ['a', 'b', 'c'];
array1.forEach(function(element) {
  console.log(element);
});
// a
// b
// c

forEach() exécute la fonction fournie une fois pour chaque élément du tableau.

Cas : la boucle for est convertie en forEach

Avant la conversion

const items = ['item1', 'item2', 'item3'];
const copy = [];
for (let i=0; i<items.length; i++) {
  copy.push(items[i])
}

Après la conversion

const items = [&#39;item1&#39;, &#39;item2&#39;, &#39;item3&#39;];
const copy = [];
items.forEach(function(item){
  copy.push(item)
});

Les résultats sont tous

copy: ["item1", "item2", "item3"]

Cas : Imprimer le contenu du tableau

function logArrayElements(element, index, array) {
    console.log("a[" + index + "] = " + element);
}
// 注意索引2被跳过了,因为在数组的这个位置没有项
[2, 5, ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[3] = 9
[2, 5,"" ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] = 
// a[3] = 9
[2, 5, undefined ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] = undefined
// a[3] = 9
let xxx;
// undefined
[2, 5, xxx ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] = undefined
// a[3] = 9

La plage parcourue par forEach sera déterminée avant que le rappel ne soit appelé pour la première fois. Les éléments ajoutés au tableau après avoir appelé forEach ne seront pas accessibles par le rappel. Si une valeur existante est modifiée, les valeurs transmises au rappel sont les valeurs actuellement forEach parcourues. Les éléments supprimés ne seront pas parcourus. Si l'élément visité est supprimé pendant l'itération (par exemple, en utilisant shift()), les éléments suivants seront ignorés - voir le code

var words = ["one", "two", "three", "four"];
words.forEach(function(word) {
  console.log(word);
  if (word === "two") {
    words.shift();
  }
});
// one
// two
// four

Je ne sais pas si vous comprenez le code ci-dessus, mais il est parce que lorsque vous en exécutez deux, vous supprimez le premier élément du tableau. Cependant, l'élément avec l'index d'origine de 1 devient 0 après avoir supprimé l'élément précédent, et vous avez déjà exécuté 0, il ne sera donc pas exécuté sur le. côté exécution. La plage parcourue par forEach a été déterminée avant que la fonction de rappel ne soit appelée pour la première fois, et les éléments supprimés ne seront pas parcourus.

Regardons un exemple, changez-le légèrement :

var words = ["one", "two", "three","", "four"];
words.forEach(function(word) {
words =  ["one", "two", "three","fix", "four"];
  console.log(word);
  if (word === "two") {
    words.shift();
 }
});
// one
// two
// three
//  
// four

Lorsque l'index ci-dessus est 3, le résultat de sortie est vide, même si vous l'avez réaffecté une fois, prenons un regardez les résultats des mots :

console.log(words)
// ["one", "two", "three", "fix", "four"]

Ce qui précède est mon résumé, et j'espère que vous pourrez en ajouter d'autres.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn