it-swarm-pt.tech

Como eu enumero as propriedades de um objeto JavaScript?

Como eu enumero as propriedades de um objeto JavaScript?

Eu realmente quero listar todas as variáveis ​​definidas e seus valores, mas aprendi que definir uma variável cria uma propriedade do objeto window.

630
davenpcj

Simples o suficiente:

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

Agora, você não obterá variáveis ​​particulares dessa maneira porque elas não estão disponíveis.


EDIT: @ bitwiseplatypus está correto que a menos que você use o método hasOwnProperty(), você obterá propriedades que são herdadas - no entanto, eu não sei por que alguém familiarizado com programação orientada a objetos esperaria nada menos! Normalmente, alguém que faz isso foi submetido aos avisos de Douglas Crockford sobre isso, que ainda me confundem um pouco. Novamente, a herança é uma parte normal das linguagens OO e, portanto, é parte do JavaScript, apesar de ser prototípica.

Agora, dito isto, hasOwnProperty() é útil para filtragem, mas não precisamos soar um aviso como se houvesse algo perigoso em obter propriedades herdadas.

EDIT 2: @ bitwiseplatypus traz a situação que ocorreria se alguém adicionasse propriedades/métodos aos seus objetos em um momento posterior ao que você originalmente escreveu seus objetos (através de seu protótipo) - enquanto estiver verdade que isso pode causar um comportamento inesperado, eu pessoalmente não vejo isso como o meu problema totalmente. Apenas uma questão de opinião. Além disso, e se eu projetar as coisas de tal forma que eu use protótipos durante a construção dos meus objetos e ainda tenha código que intera sobre as propriedades do objeto e eu quero todas as propriedades herdadas? Eu não usaria hasOwnProperty(). Então, digamos, alguém adiciona novas propriedades mais tarde. Isso é minha culpa se as coisas se comportarem mal nesse ponto? Acho que não. Eu acho que é por isso que o jQuery, como um exemplo, especificou maneiras de estender como funciona (via jQuery.extend e jQuery.fn.extend).

790
Jason Bunting

Use um loop for..in para enumerar as propriedades de um objeto, mas tenha cuidado. A enumeração retornará propriedades não apenas do objeto que está sendo enumerado, mas também dos protótipos de qualquer objeto pai.

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'

Para evitar a inclusão de propriedades herdadas na sua enumeração, verifique hasOwnProperty():

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

Edit: Eu não concordo com a afirmação de JasonBunting de que não precisamos nos preocupar com a enumeração de propriedades herdadas. Lá é o perigo de enumerar propriedades herdadas que você não está esperando, porque isso pode alterar o comportamento do seu código.

Não importa se esse problema existe em outros idiomas; O fato é que existe e o JavaScript é particularmente vulnerável, pois modificações no protótipo de um objeto afetam objetos filhos, mesmo que a modificação ocorra após a instanciação.

É por isso que o JavaScript fornece hasOwnProperty(), e é por isso que você deve usá-lo para garantir que o código de terceiros (ou qualquer outro código que possa modificar um protótipo) não quebre o seu. Além de adicionar alguns bytes extras de código, não há desvantagem em usar hasOwnProperty().

215
Ryan Grove

O caminho padrão, que já foi proposto várias vezes é:

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

No entanto, o Internet Explorer 6, 7 e 8 tem um bug no intérprete JavaScript, o que faz com que algumas chaves não sejam enumeradas. Se você executar este código:

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

Se vai alertar "12" em todos os navegadores, exceto o IE. IE simplesmente ignorará esta chave. Os valores da chave afetada são:

  • isPrototypeOfname__
  • hasOwnPropertyname__
  • toLocaleStringname__
  • toStringname__
  • valueOfname__

Para ser realmente seguro em IE você tem que usar algo como:

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

A boa notícia é que o EcmaScript 5 define a função Object.keys(myObject), que retorna as chaves de um objeto como array e alguns navegadores (por exemplo, Safari 4) já o implementam.

50
Fabian Jakobs

Nos navegadores modernos (ECMAScript 5) para obter todas as propriedades enumeráveis ​​que você pode fazer:

Object.keys (obj) (Verifique o link para obter um snippet para compatibilidade com versões anteriores em navegadores mais antigos)

Ou para obter também propriedades não enumeráveis:

Object.getOwnPropertyNames (obj)

Verifique a tabela de compatibilidade do ECMAScript 5

Informações adicionais: O que é um atributo enumerável?

44
Carlos Ruana

Acho que um exemplo do caso que me pegou de surpresa é relevante:

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

Mas para minha surpresa, a saída é

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

Por quê? Outro script na página estendeu o protótipo do objeto:

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

Código JavaScript simples:

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

Eu encontrei ... for (property in object) { // do stuff } listará todas as propriedades e, portanto, todas as variáveis ​​declaradas globalmente no objeto window.

9
davenpcj

Veja como enumerar as propriedades de um objeto:

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

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

Se você estiver usando a biblioteca nderscore.js , você pode usar a função keys :

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

O dict de Python tem o método 'keys', e isso é realmente útil. Eu acho que em JavaScript podemos ter algo assim:

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: Mas a resposta de @ carlos-ruana funciona muito bem. Eu testei Object.keys (janela), e o resultado é o que eu esperava.

EDITAR após 5 anos: não é uma boa idéia estender Object, porque pode entrar em conflito com outras bibliotecas que podem querer usar keys em seus objetos e isso levará um comportamento imprevisível em seu projeto. @ carlos-ruana resposta é a maneira correta de obter as chaves de um objeto.

5
Fabio Montefuscolo

Você pode usar o for do loop.

Se você quiser um array use:

Object.keys(object1)

Ref. Object.keys ()

4
Walle Cyril

Se você estiver tentando enumerar as propriedades para escrever um novo código no objeto, recomendo usar um depurador como o Firebug para vê-las visualmente.

Outra técnica útil é usar Object.toJSON () do Prototype para serializar o objeto para JSON, que mostrará os nomes e os valores das propriedades.

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

Eu ainda sou um iniciante em JavaScript, mas eu escrevi uma pequena função para recursivamente imprimir todas as propriedades de um objeto e seus filhos:

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