Maison > interface Web > js tutoriel > Pourquoi devrais-je éviter d'utiliser des boucles « for...in » pour l'itération de tableau en JavaScript ?

Pourquoi devrais-je éviter d'utiliser des boucles « for...in » pour l'itération de tableau en JavaScript ?

Mary-Kate Olsen
Libérer: 2024-12-28 22:07:18
original
490 Les gens l'ont consulté

Why Should I Avoid Using `for...in` Loops for Array Iteration in JavaScript?

Évitez "for...in" pour l'itération de tableau en JavaScript

La boucle "for...in" de JavaScript présente un piège potentiel lors d'une itération sur des tableaux. Bien que cela semble être une approche appropriée, elle peut conduire à des résultats inattendus.

Pourquoi c'est une mauvaise idée

Les boucles "for...in" parcourent les propriétés , y compris ceux qui ne sont pas directement définis dans le tableau. Cela inclut les propriétés héritées du prototype du tableau ou ajoutées dynamiquement.

Par exemple, considérons le code suivant :

var a = []; // Empty array
a[5] = 5; // Resize the array
Copier après la connexion

Malgré la création d'un tableau vide, l'attribution d'une valeur à son cinquième index redimensionne efficacement le tableau.

Lors d'une itération en utilisant "for...in":

for (var i in a) {
  console.log(a[i]);
}
Copier après la connexion

La boucle parcourir les propriétés suivantes :

  • 0, 1, 2, 3, 4 (les indices numériques)
  • 5 (la valeur attribuée au cinquième index)

Cependant, il sera également potentiellement itératif sur les propriétés héritées ou sur d'autres propriétés ajoutées à l'objet tableau, qui peuvent ne pas être pertinentes pour le tableau. data.

À la place, utilisez une boucle numérique

Pour parcourir des tableaux spécifiquement, utilisez une boucle numérique :

for (var i = 0; i < a.length; i++) {
  console.log(a[i]);
}
Copier après la connexion

Cette boucle itère explicitement sur les indices numériques du tableau, garantissant que seules les valeurs attendues sont accessibles.

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!

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal