Introduction à plusieurs boucles différentes en js (avec code)

Ce que cet article vous apporte est une introduction à plusieurs boucles différentes en js (avec code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

JavaScript fournit de nombreuses méthodes pour itérer des boucles.

for

const list = ['a', 'b', 'c']
for (let i = 0; i < list.length; i++) {
  console.log(list[i]) //value
  console.log(i) //index
}

• Vous pouvez utiliser break pour briser la boucle for

• Vous peut utiliser continuer continue avec la prochaine itération de la boucle for

forEach

a été introduite dans ES5. Étant donné un tableau, vous pouvez parcourir ses propriétés en utilisant list.forEach() :

const list = ['a', 'b', 'c']
list.forEach((item, index) => {
  console.log(item) //value
  console.log(index) //index
})

//index is optional
list.forEach(item => console.log(item))

Notez cependant que vous ne pouvez pas sortir de cette boucle.

faire...while

const list = ['a', 'b', 'c']
let i = 0
do {
  console.log(list[i]) //value
  console.log(i) //index
  i = i + 1
} while (i < list.length)

Vous pouvez utiliser break pour interrompre la boucle while :

do {
  if (something) break
} while (true)

Vous pouvez utiliser continuer pour passer à l'itération suivante :

do {
  if (something) continue

  //do something else
} while (true)

while

const list = ['a', 'b', 'c']
let i = 0
while (i < list.length) {
  console.log(list[i]) //value
  console.log(i) //index
  i = i + 1
}

Vous pouvez utiliser break pour interrompre la boucle while :

while (true) {
  if (something) break
}

Vous pouvez utiliser continuer pour passer à l'itération suivante :

while (true) {
  if (something) continue

  //do something else
}

La différence avec do...while est que do... while exécute toujours la boucle au moins une fois.

for...in

Itère sur toutes les propriétés énumérables d'un objet, en fonction des noms de propriété.

for (let property in object) {
  console.log(property) //property name
  console.log(object[property]) //property value
}

for...of

ES2015 a introduit la boucle for, qui combine la simplicité de forEach avec la puissance de piratage :

//iterate over the value
for (const value of ['a', 'b', 'c']) {
  console.log(value) //value
}

//get the index as well, using `entries()`
for (const [index, value] of ['a', 'b', 'c'].entries()) {
  console.log(index) //index
  console.log(value) //value
}

Notez l'utilisation de const. Cette boucle crée une nouvelle plage à chaque itération, afin que nous puissions l'utiliser en toute sécurité au lieu de let.

pour...in VS FOR...OF La différence entre

et for...in est :

• pour... de Itérer la valeur de l'attribut

• pour...dans Itérer le nom de l'attribut

Recommandations associées :

La boucle for while de JS

Analyse de la différence entre la boucle for in de js et la boucle foreach de java

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!