Maison > interface Web > js tutoriel > le corps du texte

Quelles sont les méthodes de boucle en javascript

青灯夜游
Libérer: 2021-06-15 17:16:44
original
4600 Les gens l'ont consulté

Méthodes : 1. boucle for ; 2. boucle for in ; 3. boucle while ; 5. boucle forEach ; 7. filter(); (); 9. chaque(); 10. réduire(); 11. pour une boucle, etc.

Quelles sont les méthodes de boucle en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3

12 en JavaScript Types de méthodes de parcours de boucle

1 for loop

let arr = [1,2,3];
for (let i=0; i<arr.length; i++){
 console.log(i,arr[i])
}
// 0 1
// 1 2
// 2 3
Copier après la connexion

for loop est l'outil de boucle le plus couramment utilisé en Js, souvent. utilisé pour les tableaux en boucle.

2. for in loop

let obj = {name:&#39;zhou&#39;,age:&#39;**&#39;}
for(let i in obj){
 console.log(i,obj[i])
}
// name zhou
// age **
Copier après la connexion

for in loop est principalement utilisé pour parcourir des objets ordinaires, i représente la valeur clé de l'objet, obj[i] représente le valeur correspondante, lorsque vous l'utilisez pour parcourir un tableau, le même effet peut être obtenu dans la plupart des cas, mais vous ne devriez pas le faire, car i est affiché sous forme de chaîne, pas l'indice numérique requis par le tableau, ce qui signifie que dans certains cas, des opérations sur les chaînes se produiront, entraînant des erreurs de données, telles que : '52'+1 = '521' au lieu des 53 dont nous avons besoin.

De plus, lorsque la boucle for in parcourt non seulement ses propres propriétés, elle trouvera également le prototype, il est donc préférable d'ajouter un jugement dans le corps de la boucle, utilisez simplement obj[i].hasOwnProperty( i), afin d'éviter que trop d'attributs inutiles ne soient traversés.

3. Boucle while
Parcourez de la même manière le tableau cars, utilisez d'abord la méthode de boucle for

let cars=["BMW","Volvo","Saab","Ford"];
let i=0;
for (;cars[i];)
{
console.log(cars[i])
i++;
};
// BMW
// Volvo
// Saab
// Ford
Copier après la connexion

puis la méthode de boucle while

cars=["BMW","Volvo","Saab","Ford"];
var i=0;
while (cars[i])
{
console.log(cars[i] + "<br>")
i++;
};
Copier après la connexion

Nous avons découvert qu'ils pouvaient obtenir le même effet. En fait, leur traitement sous-jacent est le même. Cependant, la boucle for peut regrouper la définition, le jugement conditionnel et les opérations d'incrémentation et de décrémentation dans une seule condition d'exécution. pratique, c'est tout.

4. boucle do while

let i = 3;
do{
 console.log(i)
 i--;
}
while(i>0)
// 3
// 2
// 1
Copier après la connexion

La boucle do while est une variante de la boucle while Elle effectue d'abord une opération, puis effectue un jugement conditionnel. est vrai Continuez à effectuer l'opération. S'il est faux, la boucle se termine.

5. Boucle Array forEach

let arr = [1,2,3];
arr.forEach(function(i,index){
 console.log(i,index)
})
// 1 0
// 2 1
// 3 2
Copier après la connexion

boucle forEach, parcourt chaque élément du tableau et prend des opérations. Vous n'avez pas besoin de le faire. connaître la longueur du tableau. Il a trois paramètres, seul le premier est requis, représente la valeur sous l'index actuel.

Veuillez également noter que la boucle forEach ne peut pas être arrêtée avant que tous les éléments ne soient appelés. Elle n'a pas d'instruction break. Si vous devez vous arrêter, vous pouvez essayer une instruction try catch, qui doit être lancée lorsque vous le faites. souhaitez forcer une sortie. Une erreur est interceptée par catch, puis renvoyée dans catch, afin que la boucle puisse être terminée. Si vous utilisez souvent cette méthode, il est préférable de personnaliser une telle fonction forEach dans votre bibliothèque.

6. La méthode Array map()

let arr = [1,2,3];
let tt = arr.map(function(i){
 console.log(i)
 return i*2;
})
// [2,4,6]
Copier après la connexion

la méthode map() renvoie un nouveau tableau, et les éléments du tableau sont les valeurs du tableau d'origine éléments après avoir appelé la fonction.
Remarque : les méthodes map et forEach ne peuvent être utilisées que pour parcourir des tableaux, pas des objets ordinaires.

7. Méthode Array filter()

let arr = [1,2,3];
let tt = arr.filter(function(i){
 return i>1;
})
// [2,3]
Copier après la connexion

La méthode filter est une méthode intégrée de l'objet Array. Elle renverra les éléments filtrés sans modifier l'original. tableau.

8. Méthode Array some()

let arr = [1,2,3];
let tt = arr.some(function(i){
 return i>1;
})
// true
Copier après la connexion

la méthode some() est utilisée pour détecter si les éléments du tableau répondent aux conditions spécifiées (fournies par la fonction) et renvoie une valeur booléenne. Le tableau d'origine n'est pas modifié.

9. Méthode Array each()

let arr = [1,2,3];
let tt = arr.some(function(i){
 return i>1;
})
// 检测数组中元素是否都大于1
// false
Copier après la connexion

every() est utilisée pour détecter si tous les éléments du tableau remplissent les conditions spécifiées (fournies via la fonction) et renvoie une valeur booléenne, ne modifie pas le tableau d'origine.

10. La méthode Array reduction()

let arr = [1,2,3];
let ad = arr.reduce(function(i,j){
 return i+j;
})
// 6
Copier après la connexion

la méthodereduce() reçoit une fonction comme accumulateur, en commençant par chaque valeur du tableau (de gauche à droite) Réduit et finalement calculé à une valeur.

11. La méthode Array réduireRight()

let arr = [1,2,3];
let ad = arr.reduceRight(function(i,j){
 return i+j;
})
// 6
Copier après la connexion

reduceRight() a la même fonction que réduire(), elle commence à partir de la fin du calcul avant du tableau.

12. boucle for of

let arr = [&#39;name&#39;,&#39;age&#39;];
for(let i of arr){
 console.log(i)
}
// name
// age
Copier après la connexion

La boucle for of est une nouvelle instruction dans Es6, utilisée pour remplacer for in et forEach. Elle vous permet de parcourir des tableaux (. array ), Strings (strings), Maps (mappages), Sets (sets) et autres structures de données itérables (données itérables), faites attention à sa compatibilité.

Pour plus de connaissances sur la programmation, veuillez visiter : Introduction à la programmation ! !

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal