it-swarm.it

Come faccio a enumerare le proprietà di un oggetto JavaScript?

Come faccio a enumerare le proprietà di un oggetto JavaScript?

In realtà voglio elencare tutte le variabili definite e i loro valori, ma ho imparato che la definizione di una variabile crea effettivamente una proprietà dell'oggetto finestra.

626
davenpcj

Abbastanza semplice:

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

Ora, non otterrai le variabili private in questo modo perché non sono disponibili.


EDIT: @bitwiseplatypus è corretto che, a meno che non si usi il metodo hasOwnProperty(), si ottengano proprietà ereditate, tuttavia non so perché qualcuno che abbia familiarità con la programmazione orientata agli oggetti si aspetti qualcosa di meno! In genere, qualcuno che lo porta in causa è stato sottoposto agli avvertimenti di Douglas Crockford su questo, che ancora mi confondono un po '. Di nuovo, l'ereditarietà è una parte normale di OO lingue ed è quindi parte di JavaScript, nonostante sia prototipo.

Detto questo, hasOwnProperty() is è utile per il filtraggio, ma non è necessario emettere un avviso come se ci fosse qualcosa di pericoloso nell'ottenere proprietà ereditate.

EDIT 2: @bitwiseplatypus mostra la situazione che si verifica se qualcuno aggiunge proprietà/metodi ai tuoi oggetti in un momento successivo a quello in cui hai scritto originariamente i tuoi oggetti (tramite il suo prototipo) - mentre è vero che questo potrebbe causare un comportamento inaspettato, personalmente non lo vedo come il mio problema interamente. Solo una questione di opinione. Inoltre, cosa succede se progetto le cose in modo tale da utilizzare i prototipi durante la costruzione dei miei oggetti e tuttavia avere un codice che itera sulle proprietà dell'oggetto e voglio tutte le proprietà ereditate? Non userei hasOwnProperty(). Quindi, diciamo, qualcuno aggiunge nuove proprietà in seguito. È colpa mia se le cose si comportano male a quel punto? Io non la penso così Penso che questo sia il motivo per cui jQuery, ad esempio, ha specificato come estendere il suo funzionamento (tramite jQuery.extend e jQuery.fn.extend).

783
Jason Bunting

Utilizza un ciclo for..in per enumerare le proprietà di un oggetto, ma fai attenzione. L'enumerazione restituirà proprietà non solo dell'oggetto che viene enumerato, ma anche dei prototipi di qualsiasi oggetto padre.

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'

Per evitare di includere proprietà ereditate nell'enumerazione, controlla hasOwnProperty():

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

Modifica: Non sono d'accordo con l'affermazione di JasonBunting che non dobbiamo preoccuparci di enumerare le proprietà ereditate. C'è is pericolo nell'enumerazione di proprietà ereditate che non ti aspetti, perché può modificare il comportamento del tuo codice.

Non importa se questo problema esiste in altre lingue; il fatto è che esiste, e JavaScript è particolarmente vulnerabile poiché le modifiche al prototipo di un oggetto interessano oggetti figlio anche se la modifica avviene dopo l'istanziazione.

Questo è il motivo per cui JavaScript fornisce hasOwnProperty(), ed è per questo che dovresti usarlo per assicurarti che il codice di terze parti (o qualsiasi altro codice che possa modificare un prototipo) non infrange il tuo. Oltre all'aggiunta di alcuni byte in più di codice, non esiste uno svantaggio nell'uso di hasOwnProperty().

215
Ryan Grove

Il modo standard, che è già stato proposto più volte è:

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

Tuttavia Internet Explorer 6, 7 e 8 hanno un bug nell'interprete JavaScript, che ha l'effetto che alcune chiavi non sono enumerate. Se esegui questo codice:

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

Se avviserà "12" in tutti i browser eccetto IE. IE ignorerà semplicemente questa chiave. I valori chiave interessati sono:

  • isPrototypeOf
  • hasOwnProperty
  • toLocaleString
  • toString
  • valueOf

Per essere veramente al sicuro in IE devi usare qualcosa come:

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

La buona notizia è che EcmaScript 5 definisce la funzione Object.keys(myObject), che restituisce le chiavi di un oggetto come array e alcuni browser (ad es. Safari 4) lo implementano già.

50
Fabian Jakobs

Nei browser moderni (ECMAScript 5) per ottenere tutte le proprietà enumerabili che è possibile fare:

Object.keys (obj) (Controlla il link per ottenere uno snippet per la compatibilità con le versioni precedenti dei browser più vecchi)

Oppure per ottenere anche proprietà non enumerabili:

Object.getOwnPropertyNames (obj)

Controllare la tabella di compatibilità di ECMAScript 5

Informazioni aggiuntive: Cos'è un attributo enumerabile?

44
Carlos Ruana

Penso che un esempio del caso che mi ha colto di sorpresa sia rilevante:

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

Ma con mia sorpresa, l'output è

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

Perché? Un altro script sulla pagina ha esteso il prototipo Object:

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

Semplice codice JavaScript:

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

L'ho trovato ... for (property in object) { // do stuff } elencherà tutte le proprietà e quindi tutte le variabili dichiarate globalmente sull'oggetto della finestra ..

9
davenpcj

Ecco come enumerare le proprietà di un oggetto:

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

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

Se stai usando Underscore.js library, puoi usare function keys :

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

Il ditt di Python ha un metodo "chiavi", e questo è veramente utile. Penso che in JavaScript possiamo avere qualcosa di questo:

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: Ma la risposta di @ carlos-ruana funziona molto bene. Ho testato Object.keys (finestra), e il risultato è quello che mi aspettavo.

EDIT dopo 5 anni: non è una buona idea estendere Object, perché può entrare in conflitto con altre librerie che potrebbero voler usare keys sui loro oggetti e questo porterà a comportamenti imprevedibili sul tuo progetto. @ carlos-ruana answer è il modo corretto per ottenere le chiavi di un oggetto.

5

Puoi usare for di loop.

Se vuoi usare un array:

Object.keys(object1)

Ref. Object.keys ()

4
Walle Cyril

Se stai cercando di enumerare le proprietà per scrivere un nuovo codice sull'oggetto, ti consiglio di utilizzare un debugger come Firebug per vederle visivamente.

Un'altra tecnica pratica consiste nell'utilizzare Object.toJSON () di Prototype per serializzare l'oggetto su JSON, che mostrerà sia i nomi di proprietà che i valori.

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

Sono ancora un principiante in JavaScript, ma ho scritto una piccola funzione per stampare in modo ricorsivo tutte le proprietà di un oggetto e dei suoi figli:

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