Une explication approfondie des boucles et des itérations du tableau js

1. La première méthode est la boucle for()

for( varindex = 0; index < array.length; i ++){}

Cette méthode est très courante et existe dans plusieurs langues, je n'entrerai donc pas dans les détails ici

2. Méthodes d'itération nouvellement ajoutées dans es5 (every, filter, forEach. , map, some)

Ces méthodes reçoivent toutes deux paramètres, 1) une fonction qui peut être exécutée sur chaque élément (la fonction transmise accepte trois paramètres : a. la valeur de l'élément du tableau ; b. la valeur de l'élément dans la position du tableau ; c. le tableau lui-même) ; 2) (facultatif) la portée dans laquelle la fonction est exécutée - affectant la valeur de celle-ci.

Syntaxe : prenez forEach comme exemple, d'autres sont similaires à

array.forEach(callback [, thisArg])

nums = [3, 2, 3, 4

1) méthode each() :

Teste si tous les éléments du tableau passez la fonction Test spécifiée, si l'un des éléments renvoie false, il renvoie false

La méthode each exécute une fonction de rappel pour chaque élément de l'élément ( n'inclut pas les éléments supprimés via certaines méthodes ou undefined, la valeur est définie comme Sauf pour les éléments non définis ), jusqu'à ce qu'un rappel soit trouvé qui amène le rappel à renvoyer false (une valeur qui peut être convertie en false), à ​​sortir de l'itération et à renvoyer false. Sinon, renvoie vrai (vrai pour tous les éléments).

Les éléments parcourus par la méthode each sont les valeurs du premier rappel, et les valeurs ajoutées par la suite ne seront pas accessibles.

function isBigEnough(elemen) {  
return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true

var a = [1, 2, 3,, 4].every (function(value){
console.log(value)   return value       
})//1，2，3，4console.log(a)
//true
a = [1, 2, 3, undefined,4].every (function(value){
console.log(value)   return value       
})
//1，2，3，undefind
console.log(a)
//false

2) méthode filter() :

Utilisez la fonction spécifiée pour tester tous les éléments, créez et renvoyez un nouveau tableau contenant tous les éléments qui réussissent le test

Filter appelle un rappel pour chaque élément du tableau ( n'inclut pas les éléments supprimés par certaines méthodes ou non définis, à l'exception des éléments dont la valeur est définie comme non définie ), et utilise tous les rappels pour renvoyer true ou Elements équivalent à true créer un nouveau tableau. Les éléments qui échouent au test de rappel seront ignorés et ne seront pas inclus dans le nouveau tableau.

var a = [1, 2, 3, 7,4].filter(function(value){   
    return value > 4      
})
console.log(a)
//[7]

3) Méthode forEach() :

forEach exécute la fonction de rappel par ordre croissant pour chaque élément connu du tableau (hors suppression ou suppression par certaines méthodes) Non défini items, à l'exception des éléments dont la valeur est définie comme indéfinie)

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 rappel. Si une valeur existante est modifiée, la valeur transmise au rappel est la valeur au moment où forEach les traverse. Les éléments supprimés ne seront pas parcourus. Si l'élément visité est supprimé lors de l'itération (par exemple en utilisant shift()), les éléments suivants seront ignorés. Il renvoie toujours undéfini et ne peut pas être appelé dans une chaîne.

Il n'y a aucun moyen d'abandonner ou de sortir de la boucle forEach, sauf en lançant une exception. Si vous en avez besoin, l'utilisation de la méthode forEach() est erronée, vous pouvez utiliser une simple boucle à la place

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

　Si le tableau est modifié lors de l'itération, les autres éléments seront ignorés .

L'exemple suivant génère "un", "deux", "quatre". Lorsque l'élément contenant la valeur « deux » est atteint, le premier élément du tableau entier est supprimé, ce qui entraîne le déplacement de tous les éléments restants d'une position. Étant donné que l'élément « quatre » se trouve désormais plus tôt dans le tableau, « trois » sera ignoré. forEach()Ne crée pas de copie du tableau avant l'itération.

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

4) méthode map() :

pour chaque élément du tableau ( n'inclut pas la suppression par certaines méthodes ou non définie Les éléments, à l'exception des éléments dont la valeur est définie comme indéfinie ) exécutent une fonction spécifiée et renvoient un nouveau tableau, chaque élément est le résultat de la fonction de rappel

Utilisez la méthode map pour Lorsque vous traitez le tableau, la plage d'éléments du tableau est déterminée avant le premier appel de la méthode de rappel. Lors de l'exécution de la méthode map : les éléments nouvellement ajoutés dans le tableau d'origine ne seront pas accessibles par le rappel ; si les éléments existants sont modifiés ou supprimés, leurs valeurs transmises au rappel sont les valeurs qui leur sont transmises par la méthode map. La valeur à un moment ; l'élément supprimé ne sera pas accessible.

var numbers = [1, 4, 9];var roots = numbers.map(Math.sqrt);/* roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9] */

5) méthode some() :

Teste si certains éléments du tableau réussissent le test de la fonction spécifiée. Si un élément renvoie vrai, il renvoie vrai

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!