Por que meu loop for-for-it não está repetindo meu objeto de matriz associativa JavaScript?
// defining an array
var array = [];
// assigning values to corresponding keys
array["Main"] = "Main page";
array["Guide"] = "Guide page";
array["Articles"] = "Articles page";
array["Forum"] = "Forum board";
// expected: loop over every item,
// yet it logs only "last" assigned value - "Forum"
for (var i = 0; i < array.length; i++) {
console.log(array[i]);
}
EDIT: jQuery each()
pode ser útil: https://api.jquery.com/jQuery.each/
javascript
arrays
foreach
Szymon Toda
fonte
fonte
associative arrays
em JS: é uma matriz simples ou um objeto. Nada impede a adição de propriedades não numéricasArray
, mas isso não aconteceassociative
- em particular, alength
propriedade não conta automaticamente essas propriedades.Respostas:
A
.length
propriedade rastreia apenas propriedades com índices numéricos (chaves). Você está usando cadeias de caracteres para chaves.Você consegue fazer isso:
Para estar seguro, é uma boa ideia em loops assim garantir que nenhuma das propriedades seja resultado inesperado da herança:
editar - provavelmente é uma boa idéia agora observar que a
Object.keys()
função está disponível em navegadores modernos e no Nó etc. Essa função retorna as teclas "próprias" de um objeto, como uma matriz:A função de retorno de chamada passada para
.forEach()
é chamada com cada tecla e o índice da chave na matriz retornado porObject.keys()
. Também passou a matriz através da qual a função está iterando, mas essa matriz não é realmente útil para nós; precisamos do objeto original . Isso pode ser acessado diretamente pelo nome, mas (na minha opinião) é um pouco melhor passá-lo explicitamente, o que é feito passando um segundo argumento para.forEach()
- o objeto original - que será vinculado comothis
dentro do retorno de chamada. (Só vi que isso foi observado em um comentário abaixo.)fonte
var arr_jq_TabContents = {};
? Quero dizer {}[]
e{}
? Apenas os diferentes protótipos?Object.keys(arr_jq_TabContents).forEach( function(key) { ... } );
Essa é uma abordagem muito simples. A vantagem é que você também pode obter as chaves:
Para ES6:
Para ES6: (se você deseja valor, índice e a própria matriz)
fonte
var
em loops sugerindo escopo que não existe. Usevar
na frente do loop oulet
no loop.for
loop gera um escopo limitado ao corpo dofor
loop. Porém, no JavaScript, uma variável declarada porvar
sempre funciona como global, mesmo que você a escreva emfor
loop. Veja aqui: davidwalsh.name/for-and-against-letvar
em Javascript cria variáveis na memória mesmo depois que o loop é concluído.Já existem alguns exemplos simples, mas noto que, como você formulou sua pergunta, você provavelmente provém de um background em PHP e espera que o JavaScript funcione da mesma maneira - isso não acontece. Um PHP
array
é muito diferente de um JavaScriptArray
.No PHP, uma matriz associativa pode fazer a maior parte do que uma matriz indexada numericamente (as
array_*
funções funcionam, você podecount()
, etc.) Você simplesmente cria uma matriz e começa a atribuir a índices de string em vez de numéricos.No JavaScript, tudo é um objeto (exceto os primitivos: string, numérico, booleano) e as matrizes são uma certa implementação que permite que você tenha índices numéricos. Qualquer coisa empurrado para uma matriz vai efectuar a sua
length
, e pode ser iterada usando métodos Array (map
,forEach
,reduce
,filter
,find
, etc.) No entanto, porque tudo é um objeto, você está sempre livre para simplesmente propriedades atribuir, porque isso é algo que você faz para qualquer objeto. A notação entre colchetes é simplesmente outra maneira de acessar uma propriedade, portanto, no seu caso:é realmente equivalente a:
Pela sua descrição, meu palpite é que você deseja uma 'matriz associativa', mas para JavaScript, este é um caso simples de usar um objeto como um mapa de hash. Além disso, eu sei que é um exemplo, mas evite nomes sem significado que descrevam apenas o tipo de variável (por exemplo
array
) e o nome com base no que ela deve conter (por exemplopages
). Objetos simples não têm muitas boas maneiras diretas de iterar; portanto, muitas vezes nos transformaremos em matrizes primeiro usandoObject
métodos (Object.keys
neste caso - há tambémentries
evalues
estão sendo adicionados a alguns navegadores agora) que podemos fazer loop.fonte
arr_jq_TabContents[key]
vê a matriz como um formulário com índice 0.fonte
Aqui está uma maneira simples de usar uma matriz associativa como um tipo de objeto genérico:
fonte
Se o node.js ou o navegador suportar
Object.entries()
, ele poderá ser usado como uma alternativa ao usoObject.keys()
( https://stackoverflow.com/a/18804596/225291 ).neste exemplo,
forEach
usa a atribuição de reestruturação de uma matriz.fonte
Isso é (essencialmente) incorreto na maioria dos casos:
Isso cria uma propriedade não-elemento na matriz com os nomes
Main
. Embora matrizes sejam objetos, normalmente você não deseja criar propriedades que não sejam de elementos.Se você deseja indexar
array
por esses nomes, normalmente usaria umMap
ou um objeto simples, não uma matriz.Com um
Map
(ES2015 +), que chamarei demap
criativo:Você, então, iterar-lo usando os iteradores de seus
values
,keys
ouentries
métodos, por exemplo:Usando um objeto simples, que chamarei de forma criativa
obj
:você iria em seguida, iterar seu conteúdo usando
Object.keys
,Object.values
ouObject.entries
, por exemplo:fonte
Neste código, usei o método brackets para valores de chamada na matriz porque ela continha matriz, no entanto, brevemente, a ideia de que uma variável i tem uma chave de propriedade e com um loop chamado ambos os valores da matriz associada
Método perfeito, se você estiver interessado, pressione como
fonte
Você consegue fazer isso
fonte