it-swarm-eu.dev

Wie zähle ich die Eigenschaften eines JavaScript-Objekts auf?

Wie zähle ich die Eigenschaften eines JavaScript-Objekts auf?

Eigentlich möchte ich alle definierten Variablen und ihre Werte auflisten, aber ich habe gelernt, dass durch das Definieren einer Variablen tatsächlich eine Eigenschaft des Fensterobjekts erstellt wird.

647
davenpcj

Einfach genug:

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

Auf diese Weise erhalten Sie keine privaten Variablen, da diese nicht verfügbar sind.


BEARBEITEN: @ bitwiseplatypus ist richtig, dass Sie, wenn Sie die hasOwnProperty() -Methode nicht verwenden, Eigenschaften erhalten, die vererbt werden. Ich weiß jedoch nicht, warum jemand, der mit objektorientierter Programmierung vertraut ist, dies erwarten würde etwas weniger! In der Regel wurde jemand, der dies anspricht, von Douglas Crockford gewarnt, was mich immer noch ein wenig verwirrt. Auch hier ist die Vererbung ein normaler Bestandteil von OO Sprachen und daher Teil von JavaScript, auch wenn sie prototypisch ist.

Nun, das heißt, hasOwnProperty() ist nützlich zum Filtern, aber wir müssen keine Warnung auslösen, als ob etwas Gefährliches drin wäre geerbte Eigenschaften erhalten.

BEARBEITEN 2: @ bitwiseplatypus bringt die Situation zur Sprache, die auftreten würde, wenn jemand zu einem Zeitpunkt Eigenschaften/Methoden zu Ihren Objekten hinzufügt, als Sie Ihre Objekte ursprünglich (über den Prototyp) geschrieben haben - solange dies der Fall ist Stimmt, dass dies zu unerwartetem Verhalten führen könnte, ich persönlich sehe das nicht als mein Problem an. Nur Ansichtssache. Was ist außerdem, wenn ich die Dinge so entwerfe, dass ich beim Erstellen meiner Objekte Prototypen verwende und dennoch Code habe, der die Eigenschaften des Objekts durchläuft, und alle geerbten Eigenschaften möchte? Ich würde hasOwnProperty() nicht verwenden. Nehmen wir an, jemand fügt später neue Eigenschaften hinzu. Ist das meine Schuld, wenn sich die Dinge an diesem Punkt schlecht verhalten? Ich glaube nicht. Ich denke, aus diesem Grund hat jQuery als Beispiel Möglichkeiten zur Erweiterung seiner Funktionsweise angegeben (über jQuery.extend und jQuery.fn.extend).

809
Jason Bunting

Verwenden Sie eine for..in -Schleife, um die Eigenschaften eines Objekts aufzulisten, aber seien Sie vorsichtig. Die Aufzählung gibt Eigenschaften nicht nur des aufzählenden Objekts zurück, sondern auch der Prototypen aller übergeordneten Objekte.

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'

Um zu vermeiden, dass geerbte Eigenschaften in Ihre Aufzählung aufgenommen werden, aktivieren Sie hasOwnProperty():

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

Edit: Ich bin nicht einverstanden mit der Aussage von JasonBunting, dass wir uns nicht darum kümmern müssen, geerbte Eigenschaften aufzulisten. Es besteht die Gefahr, geerbte Eigenschaften aufzuzählen, die Sie nicht erwarten, da dies das Verhalten Ihres Codes ändern kann.

Es spielt keine Rolle, ob dieses Problem in anderen Sprachen vorliegt. Tatsache ist, dass es existiert, und JavaScript ist besonders anfällig, da Änderungen am Prototyp eines Objekts untergeordnete Objekte betreffen, selbst wenn die Änderung nach der Instanziierung erfolgt.

Aus diesem Grund bietet JavaScript hasOwnProperty(), und aus diesem Grund sollten Sie es verwenden, um sicherzustellen, dass der Code eines Drittanbieters (oder ein anderer Code, der möglicherweise einen Prototyp ändert) Ihren nicht beschädigt. Abgesehen vom Hinzufügen einiger zusätzlicher Code-Bytes hat die Verwendung von hasOwnProperty() keine Nachteile.

218
Ryan Grove

Der bereits mehrfach vorgeschlagene Standardweg ist:

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

Internet Explorer 6, 7 und 8 haben jedoch einen Fehler im JavaScript-Interpreter, der dazu führt, dass einige Schlüssel nicht aufgelistet werden. Wenn Sie diesen Code ausführen:

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

Wenn "12" in allen Browsern außer dem IE angezeigt wird. IE ignoriert diesen Schlüssel einfach. Die betroffenen Schlüsselwerte sind:

  • isPrototypeOf
  • hasOwnProperty
  • toLocaleString
  • toString
  • valueOf

Um in IE wirklich sicher zu sein, müssen Sie Folgendes verwenden:

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]);
  }
}

Die gute Nachricht ist, dass EcmaScript 5 die Funktion Object.keys(myObject) definiert, die die Schlüssel eines Objekts als Array zurückgibt und von einigen Browsern (z. B. Safari 4) bereits implementiert wird.

51
Fabian Jakobs

In modernen Browsern (ECMAScript 5) können Sie folgende Aktionen ausführen, um alle aufzählbaren Eigenschaften abzurufen:

Object.keys (obj) (Überprüfen Sie den Link, um ein Snippet für die Abwärtskompatibilität in älteren Browsern abzurufen.)

Oder um auch nicht aufzählbare Eigenschaften zu erhalten:

Object.getOwnPropertyNames (obj)

ECMAScript 5-Kompatibilitätstabelle prüfen

Zusätzliche Informationen: Was ist ein aufzählbares Attribut?

44
Carlos Ruana

Ich denke, ein Beispiel für den Fall, der mich überrascht hat, ist relevant:

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

Aber zu meiner Überraschung ist die Ausgabe

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

Warum? Ein anderes Skript auf der Seite hat den Object-Prototyp erweitert:

Object.prototype.forEach = function (obj, callback) {
  for ( prop in obj ) {
    if ( obj.hasOwnProperty( prop ) && typeof obj[prop] !== "function" ) {
      callback( prop );
    }
  }
};
25
cyberhobo
for (prop in obj) {
    alert(prop + ' = ' + obj[prop]);
}
16
Andrew Hedges

Einfacher JavaScript-Code:

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
EmRa228

Ich habe es gefunden ... for (property in object) { // do stuff } listet alle Eigenschaften und damit alle global deklarierten Variablen im Fensterobjekt auf.

9
davenpcj

So listen Sie die Eigenschaften eines Objekts auf:

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

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

Wenn Sie die Bibliothek nderscore.js verwenden, können Sie die Funktion Tasten verwenden:

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

Sie können die for of-Schleife verwenden.

Wenn Sie ein Array verwenden möchten:

Object.keys(object1)

Ref. Object.keys ()

6
Walle Cyril

Pythons Diktat hat eine 'Schlüssel'-Methode, und das ist wirklich nützlich. Ich denke, in JavaScript können wir Folgendes haben:

function keys(){
    var k = [];
    for(var p in this) {
        if(this.hasOwnProperty(p))
            k.Push(p);
    }
    return k;
}
Object.defineProperty(Object.prototype, "keys", { value : keys, enumerable:false });

EDIT: Aber die Antwort von @ Carlos-Ruana funktioniert sehr gut. Ich habe Object.keys (Fenster) getestet und das Ergebnis ist das, was ich erwartet habe.

BEARBEITEN nach 5 Jahren: Es ist nicht ratsam, Object zu erweitern, da dies zu Konflikten mit anderen Bibliotheken führen kann, die keys für ihre Objekte verwenden möchten. Dies führt zu unvorhersehbarem Verhalten in Ihrem Projekt. @ Carlos-Ruana Antwort ist der richtige Weg, um Schlüssel eines Objekts zu erhalten.

5

Wenn Sie versuchen, die Eigenschaften aufzulisten, um neuen Code für das Objekt zu schreiben, würde ich empfehlen, einen Debugger wie Firebug zu verwenden, um sie visuell anzuzeigen.

Eine weitere praktische Methode ist die Verwendung von Object.toJSON () von Prototype, um das Objekt in JSON zu serialisieren, das Ihnen sowohl Eigenschaftsnamen als auch Werte anzeigt.

var data = {name: 'Violet', occupation: 'character', age: 25, pets: ['frog', 'rabbit']};
Object.toJSON(data);
//-> '{"name": "Violet", "occupation": "character", "age": 25, "pets": ["frog","rabbit"]}'

http://www.prototypejs.org/api/object/tojson

2
Chase Seibert

Ich bin noch ein Anfänger in JavaScript, aber ich habe eine kleine Funktion geschrieben, um alle Eigenschaften eines Objekts und seiner Kinder rekursiv zu drucken:

getDescription(object, tabs) {
  var str = "{\n";
  for (var x in object) {
      str += Array(tabs + 2).join("\t") + x + ": ";
      if (typeof object[x] === 'object' && object[x]) {
        str += this.getDescription(object[x], tabs + 1);
      } else {
        str += object[x];
      }
      str += "\n";
  }
  str += Array(tabs + 1).join("\t") + "}";
  return str;
}
0
Felix Lapalme