übersicht - Wie kann ich ein JavaScript-Objekt durchlaufen oder auflisten?




javascript objekte erstellen (20)

Object.keys (obj): Array

Ruft alle Stringwertschlüssel aller aufzählbaren eigenen (nicht geerbten) Eigenschaften ab.

Es gibt also die gleiche Liste von Schlüsseln, die Sie beabsichtigen, indem Sie jeden Objektschlüssel mit hasOwnProperty testen. Sie brauchen diese zusätzliche Testoperation nicht als und Object.keys( obj ).forEach(function( key ){}) soll schneller sein. Lass es uns beweisen:

var uniqid = function(){
			var text = "",
					i = 0,
					possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
			for( ; i < 32; i++ ) {
					text += possible.charAt( Math.floor( Math.random() * possible.length ) );
			}
			return text;
		}, 
		CYCLES = 100000,
		obj = {}, 
		p1,
		p2,
		p3,
		key;

// Populate object with random properties
Array.apply( null, Array( CYCLES ) ).forEach(function(){
	obj[ uniqid() ] = new Date()
});

// Approach #1
p1 = performance.now();
Object.keys( obj ).forEach(function( key ){
	var waste = obj[ key ];
});

p2 = performance.now();
console.log( "Object.keys approach took " + (p2 - p1) + " milliseconds.");

// Approach #2
for( key in obj ) {
	if ( obj.hasOwnProperty( key ) ) {
		var waste = obj[ key ];
	}
}

p3 = performance.now();
console.log( "for...in/hasOwnProperty approach took " + (p3 - p2) + " milliseconds.");

In meinem Firefox habe ich folgende Ergebnisse

  • Der Ansatz von Object.keys dauerte 40.21101451665163 Millisekunden.
  • für ... in / hasOwnProperty-Ansatz dauerte 98,26163508463651 Millisekunden.

PS. Auf Chrome ist der Unterschied noch größer http://codepen.io/dsheiko/pen/JdrqXa

PS2: In ES6 (EcmaScript 2015) können Sie iterierbare Objekte besser durchlaufen:

let map = new Map().set('a', 1).set('b', 2);
for (let pair of map) {
    console.log(pair);
}

// OR 
let map = new Map([
    [false, 'no'],
    [true,  'yes'],
]);
map.forEach((value, key) => {
    console.log(key, value);
});

Ich habe ein JavaScript-Objekt wie das folgende:

var p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

Jetzt möchte ich alle p Elemente durchlaufen ( p1 , p2 , p3 ...) und ihre Schlüssel und Werte erhalten. Wie kann ich das machen?

Ich kann das JavaScript-Objekt bei Bedarf ändern. Mein ultimatives Ziel ist es, einige Schlüsselwertpaare zu durchlaufen und wenn möglich, den Einsatz von eval zu vermeiden.


Da es2015 immer beliebter wird, poste ich diese Antwort, die die Verwendung von Generator und Iterator beinhaltet, um reibungslos durch Paare von [key, value] zu iterieren. Wie es in anderen Sprachen möglich ist, zum Beispiel Ruby.

Ok hier ist ein Code:

const MyObject = {
  'a': 'Hello',
  'b': 'it\'s',
  'c': 'me',
  'd': 'you',
  'e': 'looking',
  'f': 'for',
  [Symbol.iterator]: function* () {
    for (const i of Object.keys(this)) {
      yield [i, this[i]];
    }
  }
};

for (const [k, v] of MyObject) {
  console.log(`Here is key ${k} and here is value ${v}`);
}

Alle Informationen darüber, wie Sie einen Iterator und einen Generator ausführen können, finden Sie auf der Mozilla-Entwickler-Seite.

Hoffe es hat jemandem geholfen.

BEARBEITEN:

ES2017 enthält Object.entries wodurch das Object.entries [key, value] Object.entries in Objekten noch einfacher wird. Es ist nun bekannt, dass es gemäß den ts39 Stufe ts39 Teil eines Standards sein wird.

Ich denke, es ist an der Zeit, meine Antwort zu aktualisieren, damit sie noch frischer wird als jetzt.

const MyObject = {
  'a': 'Hello',
  'b': 'it\'s',
  'c': 'me',
  'd': 'you',
  'e': 'looking',
  'f': 'for',
};

for (const [k, v] of Object.entries(MyObject)) {
  console.log(`Here is key ${k} and here is value ${v}`);
}

Weitere Informationen zur Verwendung finden Sie auf der MDN Seite


Die Frage ist nicht vollständig, wenn nicht alternative Methoden zum Durchlaufen von Objekten erwähnt werden.

Heutzutage bieten viele bekannte JavaScript-Bibliotheken ihre eigenen Methoden zum Durchlaufen von Sammlungen, dh über Arrays , Objekte und arrayähnliche Objekte . Diese Methoden sind praktisch und mit jedem Browser kompatibel.

  1. Wenn Sie mit jQuery arbeiten , können Sie die Methode jQuery.each() verwenden. Es kann verwendet werden, um Objekte und Arrays nahtlos zu durchlaufen:

    $.each(obj, function(key, value) {
        console.log(key, value);
    });
    
  2. In Underscore.js finden Sie die Methode _.each() , die eine Liste von Elementen _.each() , die jeweils einer angegebenen Funktion nachgeben (achten Sie auf die Reihenfolge der Argumente in der Iterate- Funktion!):

    _.each(obj, function(value, key) {
        console.log(key, value);
    });
    
  3. Lo-Dash bietet mehrere Methoden zum Durchlaufen von Objekteigenschaften. Basic _.forEach() (oder dessen Alias _.each() ) ist nützlich, um Objekte und Arrays zu durchlaufen. (!) Objekte mit length Eigenschaft werden jedoch wie Arrays behandelt. Um dieses Verhalten zu vermeiden, wird empfohlen, _.forIn() zu verwenden. _.forIn() und _.forOwn() Methoden (diese haben auch das _.forOwn() das an erster Stelle steht):

    _.forIn(obj, function(value, key) {
        console.log(key, value);
    });
    

    _.forIn() eigene und geerbte aufzählbare Eigenschaften eines Objekts, während _.forOwn() nur die eigenen Eigenschaften eines Objekts hasOwnProperty (im hasOwnProperty Funktion hasOwnProperty ). Für einfache Objekte und Objektliterale funktioniert jede dieser Methoden gut.

Im Allgemeinen verhalten sich alle beschriebenen Methoden bei allen gelieferten Objekten gleich. Die Verwendung der nativen for..in Schleife ist normalerweise schneller als jede Abstraktion, wie z. B. jQuery.each() . Diese Methoden sind jedoch wesentlich einfacher zu verwenden, erfordern weniger Codierung und bieten eine bessere Fehlerbehandlung.


Es ist interessant, dass die Leute in diesen Antworten sowohl Object.keys() als auch for...of berührt haben, aber niemals kombiniert haben:

var map = {well:'hello', there:'!'};
for (let key of Object.keys(map))
    console.log(key + ':' + map[key]);

Sie können nicht nur for...of eines Object da es kein Iterator ist, und for...index oder .forEach() Object.keys() ist hässlich / ineffizient.
Ich bin froh, dass die meisten Leute von for...in (mit oder ohne Prüfung .hasOwnProperty() ) .hasOwnProperty() , da dies auch ein bisschen unordentlich ist, also .hasOwnProperty() meiner obigen Antwort bin ich hier, um zu sagen ...

Sie können normale Objektzuordnungen iterieren lassen! Benehmen Sie sich genau wie Map s mit direkter Verwendung der Phantasie for...of
DEMO arbeitet in Chrome und FF (ich gehe nur von ES6 aus)

var ordinaryObject = {well:'hello', there:'!'};
for (let pair of ordinaryObject)
    //key:value
    console.log(pair[0] + ':' + pair[1]);

//or
for (let [key, value] of ordinaryObject)
    console.log(key + ':' + value);

So lange Sie mein Shim unten angeben:

//makes all objects iterable just like Maps!!! YAY
//iterates over Object.keys() (which already ignores prototype chain for us)
Object.prototype[Symbol.iterator] = function() {
    var keys = Object.keys(this)[Symbol.iterator]();
    var obj = this;
    var output;
    return {next:function() {
        if (!(output = keys.next()).done)
            output.value = [output.value, obj[output.value]];
        return output;
    }};
};

Ohne ein echtes Map-Objekt erstellen zu müssen, das nicht über den schönen syntaktischen Zucker verfügt.

var trueMap = new Map([['well', 'hello'], ['there', '!']]);
for (let pair of trueMap)
    console.log(pair[0] + ':' + pair[1]);

Wenn Sie mit diesem Shim dennoch die andere Funktionalität von Map nutzen möchten (ohne sie alle einzubeziehen) und trotzdem die ordentliche Objektnotation verwenden möchten, da Objekte jetzt iterierbar sind, können Sie jetzt einfach eine Map daraus erstellen!

//shown in demo
var realMap = new Map({well:'hello', there:'!'});

Für diejenigen, die nicht gerne Shim machen oder mit prototype im Allgemeinen getObjIterator() , können Sie die Funktion stattdessen unter getObjIterator() als getObjIterator() .

//no prototype manipulation
function getObjIterator(obj) {
    //create a dummy object instead of adding functionality to all objects
    var iterator = new Object();

    //give it what the shim does but as its own local property
    iterator[Symbol.iterator] = function() {
        var keys = Object.keys(obj)[Symbol.iterator]();
        var output;

        return {next:function() {
            if (!(output = keys.next()).done)
                output.value = [output.value, obj[output.value]];
            return output;
        }};
    };

    return iterator;
}

Jetzt können Sie es einfach als gewöhnliche Funktion aufrufen, sonst ist nichts davon betroffen

var realMap = new Map(getObjIterator({well:'hello', there:'!'}))

oder

for (let pair of getObjIterator(ordinaryObject))

Es gibt keinen Grund, warum das nicht funktionieren würde.

Willkommen in der Zukunft.


In ECMAScript 5 haben Sie einen neuen Ansatz in Iterationsfeldern von Literal - Object.keys

Weitere Informationen finden Sie im Object.keys()

Meine Wahl ist unten als schnellere Lösung in aktuellen Browser-Versionen (Chrome30, IE10, FF25) aufgeführt.

var keys = Object.keys(p),
    len = keys.length,
    i = 0,
    prop,
    value;
while (i < len) {
    prop = keys[i];
    value = p[prop];
    i += 1;
}

Sie können die Leistung dieses Ansatzes mit verschiedenen Implementierungen auf jsperf.com :

Browser-Unterstützung, die Sie auf der Kompatertabelle von Kangax sehen können

Für alte Browser haben Sie eine simple und Object.keys() Polyfill

UPD:

Leistungsvergleich für alle gängigen Fälle in dieser Frage auf perfjs.info :

Objekt-Literal-Iteration


Loops können bei Verwendung von reinem JavaScript sehr interessant sein. Es scheint, dass nur ECMA6 (New 2015 JavaScript-Spezifikation) die Schleifen unter Kontrolle gebracht hat. Leider, während ich dies schreibe, haben Browser und die beliebte integrierte Entwicklungsumgebung (IDE) immer noch Schwierigkeiten, das neue Schnickschnack vollständig zu unterstützen.

Auf einen Blick sieht eine JavaScript-Objektschleife vor der ECMA6 so aus:

for (var key in object) {
  if (p.hasOwnProperty(key)) {
    var value = object[key];
    console.log(key); // This is the key;
    console.log(value); // This is the value;
  }
}

Ich weiß auch, dass dies mit dieser Frage nicht in Frage kommt, aber im Jahr 2011 fügte ECMAScript 5.1 die forEach Methode nur für Arrays hinzu, die im Grunde eine neue, verbesserte Methode zum Durchlaufen von Arrays geschaffen hat, während nicht wiederholbare Objekte mit der alten ausführlichen und verwirrenden Schleife verbleiben . Der seltsame Teil ist jedoch, dass diese neue forEach Methode keinen break unterstützt break der zu allen möglichen anderen Problemen führte.

Grundsätzlich gibt es 2011 keine wirklich solide Methode, um in JavaScript eine Schleife zu erstellen, die von vielen beliebten Bibliotheken (jQuery, Underscore usw.) zur erneuten Implementierung beschlossen wurde.

Ab 2015 haben wir jetzt eine bessere Möglichkeit, jeden Objekttyp (einschließlich Arrays und Strings) zu schleifen (und zu unterbrechen). So sieht eine Schleife in JavaScript aus, wenn die Empfehlung zum Mainstream wird:

for (let [key, value] of Object.entries(object)) {
    console.log(key); // This is the key;
    console.log(value); // This is the value;
}

Beachten Sie, dass die meisten Browser den oben genannten Code ab dem 18. Juni 2016 nicht unterstützen. Selbst in Chrome müssen Sie dieses spezielle Flag aktivieren, damit es funktioniert: chrome://flags/#enable-javascript-harmony

Bis dies zum neuen Standard wird, kann die alte Methode noch verwendet werden. Es gibt jedoch auch Alternativen in gängigen Bibliotheken oder sogar leichtgewichtige Alternativen für diejenigen, die keine dieser Bibliotheken verwenden.


Nur JavaScript-Code ohne Abhängigkeiten:

var p = {"p1": "value1", "p2": "value2", "p3": "value3"};
keys = Object.keys(p);   // ["p1", "p2", "p3"]

for(i = 0; i < keys.length; i++){
  console.log(keys[i] + "=" + p[keys[i]]);   // p1=value1, p2=value2, p3=value3
}

Sie können allen Objekten eine einfache forEach- Funktion hinzufügen, sodass Sie jedes Objekt automatisch durchlaufen können:

Object.defineProperty(Object.prototype, 'forEach', {
    value: function (func) {
        for (var key in this) {
            if (!this.hasOwnProperty(key)) {
                // skip loop if the property is from prototype
                continue;
            }
            var value = this[key];
            func(key, value);
        }
    },
    enumerable: false
});

Für diejenigen, die die " for ... in " -Methode nicht mögen:

Object.defineProperty(Object.prototype, 'forEach', {
    value: function (func) {
        var arr = Object.keys(this);
        for (var i = 0; i < arr.length; i++) {
            var key = arr[i];
            func(key, this[key]);
        }
    },
    enumerable: false
});

Nun können Sie einfach anrufen:

p.forEach (function(key, value){
    console.log ("Key: " + key);
    console.log ("Value: " + value);
});

Wenn Sie keine Konflikte mit anderen forEach-Methods erhalten möchten, können Sie sie mit Ihrem eindeutigen Namen benennen.


Sie können es einfach so durchlaufen:

for (var key in p) {
  alert(p[key]);
}

Beachten Sie, dass der key den Wert der Eigenschaft nicht annimmt, es handelt sich lediglich um einen Indexwert.


Sie müssen die for-in-Schleife verwenden

Seien Sie jedoch vorsichtig, wenn Sie diese Art von Schleife verwenden, da dadurch alle Eigenschaften entlang der Prototypkette geschleift werden .

Verwenden Sie daher bei Verwendung von for-in-Schleifen immer die Methode hasOwnProperty , um festzustellen, ob die aktuelle Eigenschaft in der Iteration tatsächlich eine Eigenschaft des Objekts ist, das Sie überprüfen:

for (var prop in p) {
    if (!p.hasOwnProperty(prop)) {
        //The current property is not a direct property of p
        continue;
    }
    //Do your logic with the property here
}

Vorwort:

  • Objekteigenschaften können eigene Eigenschaften sein (die Eigenschaft befindet sich auf dem Objekt selbst) oder vererbt werden (nicht auf dem Objekt selbst, auf einem seiner Prototypen).
  • Objekteigenschaften können aufzählbar oder nicht auflistbar sein . Nicht aufzuzählende Eigenschaften werden von vielen Eigenschaftsaufzählungen / -arrays nicht berücksichtigt.
  • Eigenschaftsnamen können Zeichenfolgen oder Symbole sein. Eigenschaften, deren Namen Symbole sind, werden von vielen Eigenschaftsaufzählungen / -arrays nicht berücksichtigt.

Im Jahr 2018 stehen Ihnen folgende Optionen zum Durchlaufen der Eigenschaften eines Objekts zur Verfügung:

  1. for-in [ MDN , spec ] - Eine Schleifenstruktur, die die Namen der aufzuzählenden Eigenschaften eines Objekts durchläuft, einschließlich geerbter Eigenschaften, deren Namen Zeichenfolgen sind
  2. Object.keys [ MDN , spec ] - Eine Funktion, die ein Array mit den Namen der eigenen , aufzählbaren Eigenschaften eines Objekts bereitstellt, deren Namen Zeichenfolgen sind.
  3. Object.values [ MDN , spec ] - Eine Funktion, die ein Array mit den Werten der eigenen , aufzählbaren Eigenschaften eines Objekts bereitstellt.
  4. Object.entries [ MDN , spec ] - Eine Funktion, die ein Array mit Namen und Werten der eigenen , aufzählbaren Eigenschaften eines Objekts bereitstellt.
  5. Object.getOwnPropertyNames [ MDN , spec ] - Eine Funktion, die ein Array mit den Namen der eigenen Eigenschaften eines Objekts bereitstellt (auch nicht auflösbare), deren Namen Zeichenfolgen sind.
  6. Object.getOwnPropertySymbols [ MDN , spec ] - Eine Funktion, die ein Array mit den Namen der eigenen Eigenschaften eines Objekts (auch nicht Object.getOwnPropertySymbols Eigenschaften) bereitstellt, deren Namen Symbole sind.
  7. Reflect.ownKeys [ MDN , spec ] - Eine Funktion, die ein Array mit den Namen der eigenen Eigenschaften eines Objekts (auch nicht aufzählbaren Eigenschaften) bereitstellt, unabhängig davon, ob es sich bei diesen Namen um Zeichenfolgen oder Symbole handelt.
  8. Wenn Sie alle Eigenschaften eines Objekts haben möchten, einschließlich nicht vererbbarer Eigenschaften, müssen Sie eine Schleife und Object.getPrototypeOf [ MDN , spec ] und Object.getOwnPropertyNames , Object.getOwnPropertySymbols oder Reflect.ownKeys für jedes Objekt in verwenden Prototypkette (Beispiel am Ende dieser Antwort).

Bei allen außer for-in Sie eine Art Schleifenkonstrukt für das Array verwenden ( for , for-of , forEach usw.).

Beispiele:

for-in :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const name in o) {
    const value = o[name];
    console.log(`${name} = ${value}`);
}

Object.keys (mit einer for-of Schleife, Sie können jedoch ein beliebiges Schleifenkonstrukt verwenden) :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const name of Object.keys(o)) {
    const value = o[name];
    console.log(`${name} = ${value}`);
}

Object.values :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const value of Object.values(o)) {
    console.log(`${value}`);
}

Object.entries :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const [name, value] of Object.entries(o)) {
    console.log(`${name} = ${value}`);
}

Object.getOwnPropertyNames :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const name of Object.getOwnPropertyNames(o)) {
    const value = o[name];
    console.log(`${name} = ${value}`);
}

Object.getOwnPropertySymbols :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const name of Object.getOwnPropertySymbols(o)) {
    const value = o[name];
    console.log(`${String(name)} = ${value}`);
}

Reflect.ownKeys :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (const name of Reflect.ownKeys(o)) {
    const value = o[name];
    console.log(`${String(name)} = ${value}`);
}

Alle Eigenschaften , einschließlich vererbter nicht aufzuzählender Eigenschaften :

// A prototype object to inherit from, with a string-named property
const p = {answer: 42};
// The object we'll look at, which inherits from `p`
const o = Object.create(p);
// A string-named property
o.question = "Life, the Universe, and Everything";
// A symbol-named property
o[Symbol("author")] = "Douglas Adams";
for (let depth = 0, current = o; current; ++depth, current = Object.getPrototypeOf(current)) {
    for (const name of Reflect.ownKeys(current)) {
        const value = o[name];
        console.log(`[${depth}] ${String(name)} = ${String(value)}`);
    }
}
.as-console-wrapper {
  max-height: 100% !important;
}


via Prototyp mit forEach (), der die Eigenschaften der Prototypkette überspringen sollte:

Object.prototype.each = function(f) {
    var obj = this
    Object.keys(obj).forEach( function(key) { 
        f( key , obj[key] ) 
    });
}


//print all keys and values
var obj = {a:1,b:2,c:3}
obj.each(function(key,value) { console.log(key + " " + value) });
// a 1
// b 2
// c 3

Ein Objekt wird zu einem Iterator, wenn es die .next () -Methode implementiert

const james = {
name: 'James',
height: `5'10"`,
weight: 185,

[Symbol.iterator]() {
let properties = []
for (let key of Object.keys(james)){
     properties.push(key);
 }

index = 0;
return {
        next: () => {
            let key = properties[index];
            let value = this[key];
            let done = index >= properties.length - 1 ;
            index++;
            return { key, value, done };
        }
    };
  }

};


const iterator = james[Symbol.iterator]();

console.log(iterator.next().value); // 'James'
console.log(iterator.next().value); // `5'10`
console.log(iterator.next().value); // 185

In Anbetracht von ES6 möchte ich meinen eigenen Zuckerlöffel hinzufügen und eine weitere Annäherung anstellen, um die Eigenschaften des Objekts zu durchlaufen.

Da ein einfaches JS-Objekt nicht direkt nach dem iterable , können wir keine for..ofSchleife zum Durchlaufen seines Inhalts verwenden. Aber niemand kann uns daran hindern , es iterierbar zu machen .

Lass uns ein bookObjekt haben.

let book = {
  title: "Amazing book",
  author: "Me",
  pages: 3
}

book[Symbol.iterator] = function(){

  let properties = Object.keys(this); // returns an array with property names
  let counter = 0;
  let isDone = false;

  let next = () => {
    if(counter >= properties.length){
      isDone = true;
    }
    return { done: isDone, value: this[properties[counter++]] }
  }

  return { next };
}

Da wir es geschafft haben, können wir es so verwenden:

for(let pValue of book){
  console.log(pValue);
}
------------------------
Amazing book
Me
3

Oder wenn Sie die Leistungsfähigkeit von ES6- generators , können Sie den obigen Code sicherlich viel kürzer machen.

book[Symbol.iterator] = function *(){

  let properties = Object.keys(this);
  for (let p of properties){
    yield this[p];
  }

}

Sicher, Sie können ein solches Verhalten für alle Objekte anwenden, indem Sie es Objectauf prototypeEbene iterierbar machen .

Object.prototype[Symbol.iterator] = function() {...}

Außerdem können Objekte, die dem iterierbaren Protokoll entsprechen, mit dem neuen Feature- spread Operator von ES2015 verwendet werden. Daher können die Objekteigenschaften als Array gelesen werden.

let pValues = [...book];
console.log(pValues);
-------------------------
["Amazing book", "Me", 3]

Oder Sie können die destructuring :

let [title, , pages] = book; // notice that we can just skip unnecessary values
console.log(title);
console.log(pages);
------------------
Amazing book
3

Sie können JSFiddle mit dem gesamten Code überprüfen, den ich oben angegeben habe.


In dem neuesten ES-Skript können Sie Folgendes tun:

Object.entries(p);

seit ES06 können Sie die Werte eines Objekts als Array mit erhalten

let arrValues = Object.values( yourObject) ;

es gibt ein Array der Objektwerte zurück und extrahiert keine Werte aus Prototype !!

MDN DOCS Object.values ​​()

und für Schlüssel (hier schon vor mir geantwortet)

let arrKeys   = Object.keys(yourObject);

var p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

for (var key in p) {
    if (p.hasOwnProperty(key)) {
        console.log(key + " = " + p[key]);
    }
}
<p>
  Output:<br>
  p1 = values1<br>
  p2 = values2<br>
  p3 = values3
</p>


Ich würde das eher tun, als obj.hasOwnerPropertyin jeder for ... inSchleife nachzuschauen.

var obj = {a : 1};
for(var key in obj){
    //obj.hasOwnProperty(key) is not needed.
    console.log(key);
}
//then check if anybody has messed the native object. Put this code at the end of the page.
for(var key in Object){
    throw new Error("Please don't extend the native object");
}

Wenn Sie nur über Eigenschaften iterieren möchten, verwenden Sie eine der obigen Antworten. Wenn Sie jedoch alles einschließlich der Funktionen Object.getOwnPropertyNames(obj) möchten, möchten Sie möglicherweise Object.getOwnPropertyNames(obj)

for (let o of Object.getOwnPropertyNames(Math)) {
  console.log(o);
}

Manchmal verwende ich dies, um alle Funktionen an Objekten mit einfachen Ein- und Ausgängen schnell zu testen.


Wenn jemand ArrayObjects mit Bedingung durchlaufen muss :

var arrayObjects = [{"building":"A", "status":"good"},{"building":"B","status":"horrible"}];

for (var i=0; i< arrayObjects.length; i++) {
  console.log(arrayObjects[i]);
  
  for(key in arrayObjects[i]) {      
    
      if (key == "status" && arrayObjects[i][key] == "good") {
        
          console.log(key + "->" + arrayObjects[i][key]);
      }else{
          console.log("nothing found");
      }
   }
}





each