Question Itérer à travers les propriétés de l'objet


var obj = {
    name: "Simon",
    age: "20",
    clothing: {
        style: "simple",
        hipster: false
    }
}

for(var propt in obj){
    alert(propt + ': ' + obj[propt]);
}

Comment la variable propt représenter les propriétés de l'objet? Ce n'est pas une méthode intégrée ou une propriété. Alors pourquoi trouve-t-il toutes les propriétés dans l'objet?


1512
2017-11-29 14:30


origine


Réponses:


Itérer sur les propriétés nécessite ce supplément hasOwnProperty vérifier:

for (var property in object) {
    if (object.hasOwnProperty(property)) {
        // do stuff
    }
}

C'est nécessaire car le prototype d'un objet contient des propriétés supplémentaires pour l'objet qui font techniquement partie de l'objet. Ces propriétés supplémentaires sont héritées de la classe d'objet de base, mais sont toujours des propriétés de object.

hasOwnProperty vérifie simplement s'il s'agit d'une propriété spécifique à cette classe et non héritée de la classe de base.


2052
2018-05-24 12:38



À partir de JavaScript 1.8.5, vous pouvez utiliser Object.keys(obj) pour obtenir un tableau de propriétés défini sur l'objet lui-même (ceux qui retournent vrai pour obj.hasOwnProperty(key)).

Object.keys(obj).forEach(function(key,index) {
    // key: the name of the object key
    // index: the ordinal position of the key within the object 
});

C'est mieux (et plus lisible) que d'utiliser une boucle for-in.

Son support sur ces navigateurs:

  • Firefox (Gecko): 4 (2.0)
  • Chrome: 5
  • Internet Explorer: 9

Voir le réseau de développeurs Mozilla Object.keys ()la référence pour plus d'informations.


773
2017-08-13 07:19



C'est le for...in statement (MDN, Spécification ECMAScript).

Vous pouvez le lire comme "POUR toutes les propriétés DANS la obj objet, affecter chaque propriété à PROPT variable à son tour ".


189
2017-11-29 14:32



Les filles et les gars nous sommes en 2017 et nous n'avons pas beaucoup de temps pour taper ... Alors faisons ce cool nouveau fantaisie ECMAScript 2016:

Object.keys(obj).forEach(e => console.log(`key=${e}  value=${obj[e]}`));

142
2017-11-22 08:47



Dans les prochaines versions d'ES, vous pouvez utiliser Object.entries:

for (const [key, value] of Object.entries(obj)) { }

ou

Object.entries(obj).forEach(([key, value]) => ...)

Si vous souhaitez simplement parcourir les valeurs, utilisez Object.values:

for (const value of Object.values(obj)) { }

ou

Object.values(obj).forEach(value => ...)

57
2017-09-13 06:41



C'est juste un for...in boucle. Check-out la documentation sur Mozilla.


37
2017-11-29 14:33



jquery vous permet de faire ceci maintenant:

$.each( obj, function( key, value ) {
  alert( key + ": " + value );
});

20
2018-03-29 15:19



Les réponses ci-dessus sont un peu ennuyeuses car elles n'expliquent pas ce que vous faites à l'intérieur de la boucle for après que vous vous assuriez que c'est un objet: VOUS NE L'ACCÉDEZ PAS DIRECTEMENT! En fait, vous ne recevez que la clé dont vous avez besoin pour appliquer le OBJ:

var obj = {
  a: "foo",
  b: "bar",
  c: "foobar"
};

// We need to iterate the string keys (not the objects)
for(var someKey in obj)
{
  // We check if this key exists in the obj
  if (obj.hasOwnProperty(someKey))
  {
    // someKey is only the KEY (string)! Use it to get the obj:
    var myActualPropFromObj = obj[someKey]; // Since dynamic, use [] since the key isn't literally named "someKey"

    // NOW you can treat it like an obj
    var shouldBeBar = myActualPropFromObj.b;
  }
}

C'est tout ECMA5 sûr. Même fonctionne dans les versions JS boiteux comme Rhino;)


12
2017-10-28 05:39



Vous pouvez utiliser Lodash. La documentation 

var obj = {a: 1, b: 2, c: 3};
_.keys(obj).forEach(function (key) {
    ...
});

11
2017-11-04 16:51



La boucle for ... in représente chaque propriété d'un objet car elle est juste comme une boucle for. Vous avez défini propt dans la boucle for ... in en faisant:

    for(var propt in obj){
alert(propt + ': ' + obj[propt]);
}

A for ... in loop itère à travers les propriétés énumérables d'un objet. Quelle que soit la variable que vous définissez ou que vous placez dans la boucle for ... in, elle change chaque fois qu'elle passe à la propriété suivante qu'elle itère. La variable de la boucle for ... in traverse les clés, mais sa valeur est la valeur de la clé. Par exemple:

    for(var propt in obj) {
      console.log(propt);//logs name
      console.log(obj[propt]);//logs "Simon"
    }

Vous pouvez voir comment la variable diffère de la valeur de la variable. En revanche, un pour ... de la boucle fait le contraire.

J'espère que ça aide.


10
2018-01-24 03:57