Question Comment puis-je énumérer les propriétés d'un objet JavaScript? [dupliquer]


Cette question a déjà une réponse ici:

Comment puis-je énumérer les propriétés d'un objet JavaScript?

Je veux en fait répertorier toutes les variables définies et leurs valeurs, mais j'ai appris que la définition d'une variable crée en fait une propriété de l'objet window.


577
2017-09-17 18:10


origine


Réponses:


Assez simple:

for(var propertyName in myObject) {
   // propertyName is what you want
   // you can get the value like this: myObject[propertyName]
}

Maintenant, vous n'obtiendrez pas les variables privées de cette façon, car elles ne sont pas disponibles.


MODIFIER: @bitwiseplatypus est correct que si vous utilisez le hasOwnProperty() méthode, vous obtiendrez des propriétés qui sont héritées - cependant, je ne sais pas pourquoi quiconque connaissant la programmation orientée objet s'attendrait à rien de moins! Généralement, quelqu'un qui en parle a été soumis aux avertissements de Douglas Crockford à ce sujet, ce qui m'embrouille encore un peu. Encore une fois, l'héritage est une partie normale des langages OO et fait donc partie de JavaScript, même s'il est prototypique.

Maintenant, cela a dit, hasOwnProperty()  est utile pour le filtrage, mais nous n'avons pas besoin de donner un avertissement comme s'il y avait quelque chose de dangereux à obtenir des propriétés héritées.

EDIT 2: @bitwiseplatypus fait apparaître la situation qui se produirait si quelqu'un ajoutait des propriétés / méthodes à vos objets plus tard que lorsque vous aviez écrit vos objets (via son prototype) - alors qu'il est vrai que cela pourrait provoquer un comportement inattendu, personnellement je ne sais pas Je ne vois pas cela comme mon problème. Juste une question d'opinion. D'ailleurs, que faire si je conçois les choses de telle sorte que j'utilise des prototypes pendant la construction de mes objets et que je possède du code qui réponde sur les propriétés de l'objet et que je veux toutes les propriétés héritées? Je n'utiliserais pas hasOwnProperty(). Ensuite, disons, quelqu'un ajoute de nouvelles propriétés plus tard. Est-ce ma faute si les choses se comportent mal à ce moment-là? Je ne pense pas. Je pense que c'est pourquoi jQuery, à titre d'exemple, a spécifié des moyens d'étendre son fonctionnement (via jQuery.extend et jQuery.fn.extend).


737
2017-09-17 18:12



Utiliser un for..in boucle pour énumérer les propriétés d'un objet, mais attention. L'énumération renvoie des propriétés non seulement de l'objet en cours d'énumération, mais aussi des prototypes de tous les objets parents.

var myObject = {foo: 'bar'};

for (var name in myObject) {
  alert(name);
}

// results in a single alert of 'foo'

Object.prototype.baz = 'quux';

for (var name in myObject) {
  alert(name);
}

// results in two alerts, one for 'foo' and one for 'baz'

Pour éviter d'inclure des propriétés héritées dans votre énumération, vérifiez hasOwnProperty():

for (var name in myObject) {
  if (myObject.hasOwnProperty(name)) {
    alert(name);
  }
}

Modifier: Je ne suis pas d'accord avec la déclaration de JasonBunting selon laquelle nous n'avons pas à nous préoccuper de l'énumération des propriétés héritées. Là est danger d'énumérer les propriétés héritées que vous n'attendez pas, car cela peut changer le comportement de votre code.

Peu importe que ce problème existe dans d'autres langues. le fait est qu'il existe, et JavaScript est particulièrement vulnérable car les modifications apportées au prototype d'un objet affectent les objets enfants même si la modification a lieu après l'instanciation.

C'est pourquoi JavaScript fournit hasOwnProperty(), et c'est pourquoi vous devriez l'utiliser afin de s'assurer que le code de tiers (ou tout autre code qui pourrait modifier un prototype) ne vous brise pas le vôtre. En plus d'ajouter quelques octets de code supplémentaires, il n'y a aucun inconvénient à utiliser hasOwnProperty().


211
2017-09-17 18:47



La manière standard, qui a déjà été proposée plusieurs fois est:

for (var name in myObject) {
  alert(name);
}

Cependant Internet Explorer 6, 7 et 8 ont un bogue dans l'interpréteur JavaScript, ce qui a pour effet que certaines clés ne sont pas énumérées. Si vous exécutez ce code:

var obj = { toString: 12};
for (var name in obj) {
  alert(name);
}

Si alerte "12" dans tous les navigateurs sauf IE. IE ignorera simplement cette clé. Les valeurs de clé affectées sont:

  • isPrototypeOf
  • hasOwnProperty
  • toLocaleString
  • toString
  • valueOf

Pour être vraiment en sécurité dans IE, vous devez utiliser quelque chose comme:

for (var key in myObject) {
  alert(key);
}

var shadowedKeys = [
  "isPrototypeOf",
  "hasOwnProperty",
  "toLocaleString",
  "toString",
  "valueOf"
];
for (var i=0, a=shadowedKeys, l=a.length; i<l; i++) {
  if map.hasOwnProperty(a[i])) {
    alert(a[i]);
  }
}

La bonne nouvelle est qu'EcmaScript 5 définit le Object.keys(myObject) function, qui renvoie les clés d'un objet en tant que tableau et certains navigateurs (par exemple Safari 4) l'implémentent déjà.


48
2018-01-19 18:47



Dans les navigateurs modernes (ECMAScript 5) pour obtenir toutes les propriétés énumérables que vous pouvez faire:

Object.keys (obj) (Consultez le lien pour obtenir un extrait de compatibilité descendante sur les anciens navigateurs)

Ou pour obtenir également des propriétés non énumérables:

Object.getOwnPropertyNames (obj)

Vérifiez la table de compatibilité ECMAScript 5

Information additionnelle: Qu'est-ce qu'un attribut énumérable?


40
2017-11-07 11:54



Je pense qu'un exemple de l'affaire qui m'a pris par surprise est pertinent:

var myObject = { name: "Cody", status: "Surprised" };
for (var propertyName in myObject) {
  document.writeln( propertyName + " : " + myObject[propertyName] );
}

Mais à ma grande surprise, la sortie est

name : Cody
status : Surprised
forEach : function (obj, callback) {
    for (prop in obj) {
        if (obj.hasOwnProperty(prop) && typeof obj[prop] !== "function") {
            callback(prop);
        }
    }
}

Pourquoi? Un autre script sur la page a étendu le prototype d'objet:

Object.prototype.forEach = function (obj, callback) {
  for ( prop in obj ) {
    if ( obj.hasOwnProperty( prop ) && typeof obj[prop] !== "function" ) {
      callback( prop );
    }
  }
};

22
2018-04-08 21:13



for (prop in obj) {
    alert(prop + ' = ' + obj[prop]);
}

13
2017-09-17 22:51



Code JavaScript simple:

for(var propertyName in myObject) {
   // propertyName is what you want.
   // You can get the value like this: myObject[propertyName]
}

jQuery:

jQuery.each(obj, function(key, value) {
   // key is what you want.
   // The value is in: value
});

10
2017-07-04 13:41



Je l'ai trouvé... for (property in object) { // do stuff } listera toutes les propriétés, et donc toutes les variables déclarées globalement sur l'objet window.


9
2017-09-17 18:13



Si vous utilisez le Underscore.js bibliothèque, vous pouvez utiliser la fonction clés:

_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]

8
2018-04-20 13:14



Voici comment énumérer les propriétés d'un objet:

var params = { name: 'myname', age: 'myage' }

for (var key in params) {
  alert(key + "=" + params[key]);
}

8
2017-07-11 10:28