Prezado, Por gentileza, estou tentando mostrar um item no HTML mais está retornando o índice ao invés do elemento. Como posso corrigir o código ?Poderiam me dar uma dica?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Prezado, Por gentileza, estou tentando mostrar um item no HTML mais está retornando o índice ao invés do elemento. Como posso corrigir o código ?Poderiam me dar uma dica?
Oi, Nilson.
Pra identificar exatamente onde está o ajuste necessário, seria muito importante que você colasse aqui o trecho do seu código (JavaScript e HTML).
Mas, esse comportamento é muito comum quando confundimos os tipos de laços de repetição (loops) ao percorrer uma lista. O cenário mais provável é que você esteja utilizando o for...in.
No JavaScript, existe uma diferença fundamental:
for (let i in lista): Percorre os índices (as posições: 0, 1, 2...).for (let item of lista): Percorre os elementos (o valor real que está guardado).Se o seu código estiver parecido com este exemplo abaixo, ele vai mostrar apenas os números:
let frutas = ["Maçã", "Banana", "Uva"];
for (let fruta in frutas) {
// Isso vai imprimir 0, 1, 2... (os índices)
document.querySelector("ul").innerHTML += `<li>${fruta}</li>`;
}
Pra corrigir e mostrar o elemento, você tem duas opções.
Opção 1: Usar o for...of
for (let fruta of frutas) { // Troquei "in" por "of"
// Isso vai imprimir Maçã, Banana, Uva...
document.querySelector("ul").innerHTML += `<li>${fruta}</li>`;
}
Opção 2: Usar o índice para acessar a lista
Se você precisar manter o primeiro formato, deve lembrar de usar o índice para "pescar" o valor dentro da lista original:
for (let i in frutas) {
// Uso o "i" para acessar frutas[i]
document.querySelector("ul").innerHTML += `<li>${frutas[i]}</li>`;
}
Se não for esse o caso, poste seu código aqui para analisarmos.