Wie kann man über ein JavaScript-Objekt iterieren?

Question

Ich habe ein Objekt in JavaScript:

{
    abc: '...',
    bca: '...',
    zzz: '...',
    xxx: '...',
    ccc: '...',
    // ...
}

Ich möchte eine for Schleife, um seine Eigenschaften zu erhalten. Und ich möchte es in Teilen (nicht alle Objekteigenschaften auf einmal) zu wiederholen.

Bei einem einfachen Array kann ich das mit einer Standard for Schleife:

for (i = 0; i < 100; i++) { ... } // first part
for (i = 100; i < 300; i++) { ... } // second
for (i = 300; i < arr.length; i++) { ... } // last

Aber wie macht man das mit Objekten?

Answer 1

Wirklich eine PITA dies ist nicht Teil der Standard-Javascript.

/**
 * Iterates the keys and values of an object.  Object.keys is used to extract the keys.
 * @param object The object to iterate
 * @param fn (value,key)=>{}
 */
function objectForEach(object, fn) {
    Object.keys(object).forEach(key => {
        fn(object[key],key, object)
    })
}

Hinweis: Ich habe die Callback-Parameter auf (Wert, Schlüssel) umgestellt und ein drittes Objekt hinzugefügt, damit die API mit anderen APIs konsistent ist.

Verwenden Sie es so

const o = {a:1, b:true};
objectForEach(o, (value, key, obj)=>{
    // do something
});

Answer 2

Für die Iteration von Objekten verwenden wir normalerweise eine for..in Schleife. Diese Struktur durchläuft in einer Schleife alle aufzählbar Eigenschaften, auch solche, die über die prototypische Vererbung vererbt werden. Zum Beispiel:

let obj = {
  prop1: '1',
  prop2: '2'
}

for(let el in obj) {
  console.log(el);
  console.log(obj[el]);
}

Allerdings, for..in durchläuft eine Schleife über alle aufzählbaren Elemente, so dass wir die Iteration nicht in Abschnitte aufteilen können. Um dies zu erreichen, können wir die eingebaute Object.keys() Funktion, um alle Schlüssel eines Objekts in einem Array abzurufen. Anschließend können wir die Iteration in mehrere for-Schleifen aufteilen und über das Array keys auf die Eigenschaften zugreifen. Zum Beispiel:

let obj = {
  prop1: '1',
  prop2: '2',
  prop3: '3',
  prop4: '4',
};

const keys = Object.keys(obj);
console.log(keys);

for (let i = 0; i < 2; i++) {
  console.log(obj[keys[i]]);
}

for (let i = 2; i < 4; i++) {
  console.log(obj[keys[i]]);
}

Answer 3

Ja, Sie können mit der for-Schleife durch ein Objekt laufen. Hier ist ein Beispiel

var myObj = {
    abc: 'ABC',
    bca: 'BCA',
    zzz: 'ZZZ',
    xxx: 'XXX',
    ccc: 'CCC',
}

var k = Object.keys (myObj);
for (var i = 0; i < k.length; i++) {
    console.log (k[i] + ": " + myObj[k[i]]);
}

HINWEIS: das oben genannte Beispiel funktioniert nur im IE9+. Siehe Objec.keys Browserunterstützung aquí .

Answer 4

Hier ist eine handgefertigte Lösung:

function iterationForObject() {
    let base = 0,
        Keys= Object.keys(this);
    return {
        next: () => {
            return {
                value: {
                    "key": Keys[base],
                    "value": this[Keys[base]]
                },
                done: !(base++ < Keys.length)
            };
        }
    };
}
Object.prototype[Symbol.iterator] = iterationForObject;

Und dann können Sie jedes Objekt in eine Schleife legen:

for ( let keyAndValuePair of (Object Here) ) {
    console.log(`${keyAndValuePair.key} => ${keyAndValuePair.value}`);
}

Answer 5

<script type="text/javascript">
// method 1
var images = {};
images['name'] = {};
images['family'] = {};
images[1] = {};
images['name'][5] = "Mehdi";
images['family'][8] = "Mohammadpour";
images['family']['ok'] = 123456;
images[1][22] = 2602;
images[1][22] = 2602;
images[1][22] = 2602;
images[1][22] = 2602;
images[1][23] = 2602;

for (const [key1, value1] of Object.entries(images)){
    for (const [key2, value2] of Object.entries(value1)){
        console.log(`${key1} => ${key2}: ${value2}`);
    }
}

console.log("=============================");

// method 2
var arr = [];
for(var x = 0; x < 5; x++){
     arr[x] = [];    
     for(var y = 0; y < 5; y++){ 
         arr[x][y] = x*y;    
     }    
 }

for(var i = 0; i < arr.length; i++) {
    var cube = arr[i];
    for(var j = 0; j < cube.length; j++) {
        console.log("cube[" + i + "][" + j + "] = " + cube[j]);
    }
}

</script>