Un tableau .ES5 méthodes traversal et résumé ES6
1.Pour circulation.
pour ( var i = 0; i <arr.length; i ++ ) { console.log (arr [i]); }
Cette méthode est la plus simple et rien à faire attention, mais l'écriture est un peu compliqué, donc nous avons suivi en fonction des méthodes suivantes.
2.forEach
const arr = [1,2,3,4,5 ]; arr.forEach ((item) => { console.log (point); })
Cette approche semble beaucoup de facile, mais il ne peut pas briser et de continuer à arrêter ou continuer, si elle est couplée continue, erreur de rupture. Donc, de cette manière et ne peut pas arrêter au milieu sauté, que traverse un par un du début à la fin.
3.Every
const arr = [1,2,3,4,5 ]; arr.every ((item) => { console.log (point); })
Il y a tout bonne solution au problème ne peut pas être interrompu et sauté forEach, la sortie de code ci-dessus volonté d'un 1, 1,2,3,4,5 pas sortie. Si chaque retour de la fonction true, puis traverser vers le bas, si le faux retour équivaut à briser, il sera interrompu. Si rien n'est retourné, l'effet est équivalent à un faux retour, directement interrompu.
const arr = [1,2,3,4,5];
arr.every ((point) => {
if (item == 2) return true;
console.log (point);
return true;
})
Cet effet correspond au code sera sortie à 2 1,3,4,5, l'utilisation continue;
4.Pour ... en ..
const arr = [1,2,3,4,5 ]; pour ( var index dans arr) { console.log (index, arr [index]);
}
En fait, cette méthode est utilisée pour traverser l'objet, dans lequel l'indice est un type de chaîne, la sortie de ce code est:
0 1
1 2
2 3
3 4
4 5
Devant le type de chaîne, suivi d'un numéro, même si la sortie ci-dessus ressemble, mais légèrement modifié si le code:
const arr = [1,2,3,4,5 ]; arr.p = 100 ; pour ( var index dans arr) { console.log (index, arr [index]); }
La sortie est:
0 1
1 2
2 3
3 4
4 5
p 100
Vous pouvez voir la différence, non? Donc, pour ... dans un spécialement préparé pour traverser l'objet, le traversal tableau général ou ne pas utiliser aussi bien!
5.Pour ... de
pour des ES6 est nouvellement ajouté.
const arr = [1,2,3,4,5 ]; pour (point de laisser arr) { console.log (point); }
En utilisant la méthode décrite ci-dessus, et dans autres.
II ES5 et ES6 tableau factice sera transformé en un ensemble de méthodes respectives:
Pourquoi matrice artificielle est appelée pseudo-réseaux, il est parce qu'il a un tableau de caractéristiques: il y a longueur, etc. peut être parcourue, mais il n'a pas un autre tableau de fonctionnement, tels que tranche et ainsi de suite.
Montrant la définition de la matrice de mannequin: une donnée d'attribut de longueur et stocké en indexant l'objet est la matrice de mannequin.
1. obtenu par appel
arr laisser = [] .slice.call (arguments);
On suppose qu'un tableau d'arguments factices.
2. réalisé par ES6 de la nouvelle
de (arrayLike, mapFn, this.Arg) indique un paramètre pseudo premier réseau à être transformé, le deuxième paramètre représente l'opération à effectuer pour chaque point, la troisième fonction de ce paramètre représentant le second point.
laisser arr = Array.from (arguments)
De la manière décrite ci-dessus peut être converti en un tableau de données de tableau.
En fait, à partir de là une autre utilisation, vous pouvez initialiser un tableau de contenu à partir.
laisser arr = Array.from ({longueur: 5}, () => { retour 1;});
Les opérations d'initialisation ci-dessus pour le compte d'un tableau de longueur 5, 1 et initialise tous les contenus.
Trois .ES5 et ES6 créer une nouvelle gamme de méthodes
laisser arr = Array (5 );
arr laisser = [];
laisser arr = Array.from ({longueur: 5}, () => {return 1;}); // créer un tableau de longueur 5, et la matrice de toute la valeur de 1.
laisser arr = Array.of (1); // [. 1] créer un tableau, les valeurs de tableau
let ARR = Array (5) .Remplir (1.); // créer un tableau de longueur 5, et la matrice de l' ensemble des missions 1.
Au-dessus de deux est la méthode la plus commune de ES5, vous pouvez spécifier la longueur de la première, mais la deuxième ne peut pas être spécifié. Les trois méthodes suivantes sont les ES6.
Array.fill (valeur, début, fin). La première valeur doit être rempli, le deuxième tiers des positions de départ et de fin.
Quatre méthodes .ES5 et ES6 éléments à la recherche.
laisser array = [1,2,3,4,5 ]; laisser trouver = Array.filter ((item) => { retour item 2% === 0 }) console.log (FIND);
La valeur de retour de code est [2,4], ce qui est des éléments ES5 FIND de l'approche, il aurait été de trouver la fin d'un tableau et retourne un tableau. Si nous voulons trouver le premier élément pour répondre aux conditions, cette méthode serait un peu de temps.
laisser array = [1,2,3,4,5 ]; laisser trouver = array.find ((item) => { retour item 2% === 0 }) console.log (FIND);
Cette approche est nouvelle ES6 ci-dessus, le résultat final est 2, si nous voulons seulement trouver le premier élément, cette approche est raisonnable.
Résumé: L'article ci-dessus, nous résumons l'ES5 et ES6 traversent le tableau, la conversion, générer, l'opération de recherche, et comparé. Seulement comprendre les caractéristiques de chaque méthode afin de sélectionner la méthode appropriée au moment opportun.