Quelle est la différence entre la boucle for in et la boucle for en js-js tutoriel-php.cn

Quelle est la différence entre la boucle for in et la boucle for en js

一个新手

Libérer： 2017-09-09 13:04:16

original

1976 Les gens l'ont consulté

L'instruction

JavaScript for...in

l'instruction for...in est utilisée pour parcourir les propriétés d'un tableau ou d'un objet.

for ... in Chaque fois que le code de la boucle est exécuté, il opèrera sur les éléments du tableau ou sur les propriétés de l'objet.

Astuce : les boucles for-in doivent être utilisées pour parcourir des objets non-tableaux. L'utilisation d'une boucle for-in est également appelée "énumération". ·

Syntaxe :

for (变量 in 对象)
{    在此执行代码}

Copier après la connexion

"Variable" est utilisé pour spécifier des variables. Les variables spécifiées peuvent être des éléments de tableau ou des attributs d'objets.

Exemple : utilisez for ... in pour parcourir le tableau.

<html><body><script type="text/javascript">var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
for (x in mycars)
{
document.write(mycars[x] + "<br />")
}</script></body></html>

Copier après la connexion

Remarque 1 : La boucle for in n'organisera pas la sortie en fonction de l'indice de l'attribut.

//code from http://caibaojian.com/js-loop-for-in.html"first":"first",   "zoo":"zoo",  "2":"2",  "34":"34",  "1":"1",  "second":"second"};for (var i in obj) { console.log(i); };输出：1234firstzoosecond

Copier après la connexion

Lors de l'exécution, appuyez sur Chrome pour exécuter. Tout d'abord, extrayez les clés entières non négatives, triez la sortie, puis affichez le reste dans l'ordre de définition. En raison de ce paramètre étrange, le tri des objets ms-with d'Avalon n'est pas affiché comme prévu. Vous pouvez uniquement forcer les utilisateurs à ne pas définir de noms de clé avec des nombres purs.

Exemple 1 : Un nouvel attribut est défini sur l'objet prototype du tableau, et il n'y a aucun problème à utiliser la boucle for

function getNewArray(){var array=[1,2,3,4,5];Array.prototype.age=13;
var result = [];for(var i=0;i<array.length;i++){
result.push(array[i]);
}alert(result.join(''));
}

Copier après la connexion

Exemple 2 : Une boucle for in est utilisée, mais cela nous donne des attentes. J'ai toujours le résultat correct de 12345

function getArrayTwo(){var array=[1,2,3,4,5 ];
var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}

Copier après la connexion

Exemple 3 : après avoir ajouté des attributs au prototype, il est énuméré par défaut et génère finalement 1234513

function getNewArrayTwo(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}

Copier après la connexion

Il est donc recommandé de ne pas utiliser de tableaux pour exécuter une boucle for in. En fait, dans le livre High Performance JavaScript, il est également souligné que la boucle for in n'est pas bonne car elle accède toujours au prototype de l'objet pour voir s'il y en a. attributs sur le prototype. Ceci n’est pas intentionnel. Cela ajoute une pression supplémentaire à la traversée.

Solution :

Si un objet a une propriété avec le nom donné, alors Object.prototype.hasOwnProperty(name) renvoie true. Si l'objet hérite de cette propriété de la chaîne de prototypes, ou ne possède pas du tout une telle propriété, false est renvoyé. Limitez la boucle for in pour parcourir le courant via hasOwnProperty, sans tenir compte de ses propriétés de prototype.

function finalArray(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];for(var i in array){if(array.hasOwnProperty(i)){
result.push(array[i]);
}
}alert(result.join(''));
}

Copier après la connexion

Remarques :

1. Certains navigateurs, tels que le premier navigateur Safari, ne prennent pas en charge cette méthode

2. souvent utilisé comme valeurs de hachage, ce qui représente le risque que hasOwnProperty soit bloqué par d'autres propriétés (mais je suppose que personne n'est si ennuyeux d'utiliser cette propriété)

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!