Schleife durch ein einfaches JavaScript-Objekt mit den Objekten als Mitglieder

Question

Wie kann ich eine Schleife durch alle Mitglieder in einem JavaScript-Objekt, einschließlich Werte, die Objekte sind?

Wie könnte ich zum Beispiel eine Schleife durchlaufen (und jeweils auf "your_name" und "your_message" zugreifen)?

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
        "your_name": "billy",
        "your_msg": "foo equals bar"
    }
}

Answer 1

Diese Antwort ist eine Zusammenfassung der Lösungen, die in diesem Beitrag mit einigen Leistungsrückmeldungen . Ich denke, es gibt zwei Anwendungsfälle und der OP hat nicht erwähnt, ob er auf die Schlüssel zugreifen muss, um sie während des Schleifenprozesses.

I. Die Schlüssel müssen zugänglich sein

Die of y Object.keys Anfahrt

let k;
for (k of Object.keys(obj)) {

    /*        k : key
     *   obj[k] : value
     */
}

Die in Anfahrt

let k;
for (k in obj) {

    /*        k : key
     *   obj[k] : value
     */
}

Diese Option ist mit Vorsicht zu verwenden, da sie die prototypischen Eigenschaften von obj

Der ES7-Ansatz

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

}

Zum Zeitpunkt der Bearbeitung würde ich jedoch die ES7-Methode nicht empfehlen, da JavaScript intern viele Variablen initialisiert, um diese Prozedur zu erstellen (siehe die Rückmeldungen zum Beweis). Es sei denn, Sie entwickeln keine große Anwendung, die eine Optimierung verdient, dann ist es OK, aber wenn Optimierung Ihre Priorität ist, sollten Sie darüber nachdenken.

II. Wir müssen nur auf jeden Wert zugreifen

Die of y Object.values Anfahrt

let v;
for (v of Object.values(obj)) {

}

---

Weitere Rückmeldungen zu den Tests:

• Caching Object.keys o Object.values Leistung ist vernachlässigbar

Zum Beispiel,

const keys = Object.keys(obj);
let i;
for (i of keys) {
  //
}
// same as
for (i of Object.keys(obj)) {
  //
}

• Für Object.values Fall die Verwendung eines nativen for Schleife mit zwischengespeicherten Variablen in Firefox scheint etwas schneller zu sein als die Verwendung einer for...of Schleife. Der Unterschied ist jedoch nicht so wichtig und Chrome läuft for...of schneller als nativ for Schleife, daher würde ich empfehlen, die for...of im Umgang mit Object.values in jedem Fall (4. und 6. Test).

• In Firefox wird die for...in Schleife ist sehr langsam, wenn wir also den Schlüssel während der Iteration zwischenspeichern wollen, ist es besser, die Object.keys . Außerdem führt Chrome beide Strukturen mit gleicher Geschwindigkeit aus (erster und letzter Test).

Sie können die Tests hier einsehen: https://jsperf.com/es7-and-misc-loops

Answer 2

Wenn Sie Rekursion verwenden, können Sie Objekteigenschaften beliebiger Tiefe zurückgeben.

function lookdeep(object){
    var collection= [], index= 0, next, item;
    for(item in object){
        if(object.hasOwnProperty(item)){
            next= object[item];
            if(typeof next== 'object' && next!= null){
                collection[index++]= item +
                ':{ '+ lookdeep(next).join(', ')+'}';
            }
            else collection[index++]= [item+':'+String(next)];
        }
    }
    return collection;
}

//example

var O={
    a:1, b:2, c:{
        c1:3, c2:4, c3:{
            t:true, f:false
        }
    },
    d:11
};
var lookdeepSample= 'O={'+ lookdeep(O).join(',\n')+'}';

/*  returned value: (String)
O={
    a:1, 
    b:2, 
    c:{
        c1:3, c2:4, c3:{
            t:true, f:false
        }
    },
    d:11
}

*/

Answer 3

for(var k in validation_messages) {
    var o = validation_messages[k];
    do_something_with(o.your_name);
    do_something_else_with(o.your_msg);
}

Answer 4

Eine optimierte und verbesserte Version von AgileJon's Antwort:

var key, obj, prop, owns = Object.prototype.hasOwnProperty;

for (key in validation_messages ) {

    if (owns.call(validation_messages, key)) {

        obj = validation_messages[key];

        for (prop in obj ) {

            // Using obj.hasOwnProperty might cause you headache if there is
            // obj.hasOwnProperty = function(){return false;}
            // but 'owns' will always work
            if (owns.call(obj, prop)) {
                console.log(prop, "=", obj[prop]);
            }
        }
    }
}

Answer 5

P ist der Wert

for (var key in p) {
  alert(key + ' => ' + p[key]);
}

OR

Object.keys(p).forEach(key => { console.log(key, p[key]) })