Wie listet man die Eigenschaften eines JavaScript-Objekts auf?

Question

Angenommen, ich erstelle ein Objekt wie folgt:

var myObject =
        {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

Was ist der beste Weg, um eine Liste der Eigenschaftsnamen abzurufen? d.h. ich möchte am Ende mit einigen variablen "Schlüssel", so dass:

keys == ["ircEvent", "method", "regex"]

Answer 1

In modernen Browsern (IE9+, FF4+, Chrome5+, Opera12+, Safari5+) können Sie die eingebaute Objekt.Schlüssel Methode:

var keys = Object.keys(myObject);

Die oben genannten hat eine vollständige Polyfill aber eine vereinfachte Version ist:

var getKeys = function(obj){
   var keys = [];
   for(var key in obj){
      keys.push(key);
   }
   return keys;
}

Alternativ ersetzen var getKeys con Object.prototype.keys um Ihnen den Aufruf von .keys() auf ein beliebiges Objekt. Das Erweitern des Prototyps hat einige Nebenwirkungen und ich würde nicht empfehlen, dies zu tun.

Answer 2

Als slashnick darauf hingewiesen, können Sie das "for in"-Konstrukt verwenden, um ein Objekt nach seinen Attributnamen zu durchsuchen. Sie werden jedoch über alle Attributnamen in der Prototypkette des Objekts iterieren. Wenn Sie iterieren wollen sólo über die eigenen Attribute des Objekts, können Sie mit der Object#hasOwnProperty() Methode. So haben die folgenden.

for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        /* useful code here */
    }
}

Answer 3

Wie Sam Dutton antwortete, wurde in ECMAScript 5th Edition eine neue Methode für diesen Zweck eingeführt. Object.keys() wird das tun, was Sie wollen, und wird unterstützt in Firefox 4 , Chrome 6, Safari 5 und IE 9 .

Sie können die Methode auch sehr einfach in Browsern implementieren, die sie nicht unterstützen. Einige der Implementierungen sind jedoch nicht vollständig mit dem Internet Explorer kompatibel. Hier ist eine besser kompatible Lösung:

Object.keys = Object.keys || (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !{toString:null}.propertyIsEnumerable("toString"),
        DontEnums = [ 
            'toString', 'toLocaleString', 'valueOf', 'hasOwnProperty',
            'isPrototypeOf', 'propertyIsEnumerable', 'constructor'
        ],
        DontEnumsLength = DontEnums.length;

    return function (o) {
        if (typeof o != "object" && typeof o != "function" || o === null)
            throw new TypeError("Object.keys called on a non-object");

        var result = [];
        for (var name in o) {
            if (hasOwnProperty.call(o, name))
                result.push(name);
        }

        if (hasDontEnumBug) {
            for (var i = 0; i < DontEnumsLength; i++) {
                if (hasOwnProperty.call(o, DontEnums[i]))
                    result.push(DontEnums[i]);
            }   
        }

        return result;
    };
})();

Beachten Sie, dass die derzeit akzeptierte Antwort keine Prüfung auf hasOwnProperty() und gibt Eigenschaften zurück, die über die Prototypenkette vererbt werden. Es berücksichtigt auch nicht den berühmten DontEnum-Fehler im Internet Explorer, bei dem nicht aufzählbare Eigenschaften in der Prototypenkette dazu führen, dass lokal deklarierte Eigenschaften mit demselben Namen ihr DontEnum-Attribut erben.

Umsetzung von Object.keys() erhalten Sie eine robustere Lösung.

EDIT: im Anschluss an ein kürzlich geführtes Gespräch mit kangax einem bekannten Mitwirkenden an Prototype, habe ich die Abhilfe für den DontEnum-Fehler auf der Grundlage des Codes für seine Object.forIn() Funktion gefunden aquí .

Answer 4

Beachten Sie, dass Object.keys und andere ECMAScript 5-Methoden von Firefox 4, Chrome 6, Safari 5, IE 9 und höher unterstützt werden.

Zum Beispiel:

var o = {"foo": 1, "bar": 2}; 
alert(Object.keys(o));

ECMAScript 5-Kompatibilitätstabelle: http://kangax.github.com/es5-compat-table/

Beschreibung der neuen Methoden: http://markcaudill.com/index.php/2009/04/javascript-new-features-ecma5/

Answer 5

Object.getOwnPropertyNames(obj)

Diese Funktion zeigt auch nicht aufzählbare Eigenschaften an, zusätzlich zu denen, die von Object.keys(obj) .

In JS hat jede Eigenschaft ein paar Eigenschaften, darunter eine boolesche enumerable .

Im Allgemeinen sind nicht aufzählbare Eigenschaften eher "intern" und werden seltener verwendet, aber es ist aufschlussreich, sie manchmal zu untersuchen, um zu sehen, was wirklich vor sich geht.

Beispiel:

var o = Object.create({base:0})
Object.defineProperty(o, 'yes', {enumerable: true})
Object.defineProperty(o, 'not', {enumerable: false})

console.log(Object.getOwnPropertyNames(o))
// [ 'yes', 'not' ]

console.log(Object.keys(o))
// [ 'yes' ]

for (var x in o)
    console.log(x)
// yes, base

Beachten Sie auch, wie:

• Object.getOwnPropertyNames y Object.keys nicht in der Prototypenkette nach oben gehen und base
• for in tut

Mehr über die Prototypenkette erfahren Sie hier: https://stackoverflow.com/a/23877420/895245