Como usar o forEach em Javascript: exemplos detalhados contados em uma história
Como você faria para resolver esse 3 problemas usando o forEach no seu primeiro dia de trabalho como pessoa desenvolvedora Javascrit:
- Alterar o estilo dos cards de produtos de um grid
- Alterar apenas o último card de cada linha
- Alterar os cards da segunda metade da lista
Criei uma solução para esses 3 problemas com o forEach, para ajudar quem está estudando.
As soluções envolvem uma parte fundamental do forEach que é os 3 parâmetros que a função callback recebe:
itemindexarray
const produtos = document.querySelectorAll('.produto');
produtos.forEach(function(item, index, array) {
console.log(item); // cada um dos itens da lista
console.log(index); // o índice/index dele, começa em zero e vai aumentando
console.log(array); // retorna sempre a lista (não array) que vc está iterando
});
Por que o parâmetro array não retorna uma array e sim uma lista? Assim, de forma genérica?
Porque forEach não funciona apenas para arrays, mas também para nodelists. Esses são apenas dois iteráveis do Javascript, existem vários outros.
Mostrei tudo isso em detalhes no meu blog.
Vou deixar o link nas fontes :D
Qualquer dúvida, é só comentar que respondo com o maior prazer!