3 coisas que você não sabia sobre o loop forEach em JS
você acha que você sabe exatamente como o forEach loop funciona em JS?
bem, estes foram os meus pensamentos até recentemente:”apenas um loop regularfor onde você pode facilmente usar break ou return ou continue“.Hoje, vou mostrar-lhe três coisas que talvez não soubesse sobre o loop forEach.
acha que o código abaixo imprimiria 1 2 e depois pararia?
array = ;array.forEach(function (element) {
console.log(element);
if (element === 2)
return;
});// Output: 1 2 3 4
Não, Não vai. se você vem de um fundo Java, você provavelmente se perguntaria como isso é possível?
a razão é que estamos passando uma função de callback em nossa função forEach, que se comporta exatamente como uma função normal e é aplicada a cada elemento, não importa se nós return de um ou seja, quando o elemento é 2 em nosso caso.Dos documentos MDN oficiais:
não há nenhuma maneira de parar ou quebrar um laço
forEach()a não ser jogando uma exceção. Se você precisar de tal comportamento, o métodoforEach()é a ferramenta errada.
vamos reescrever o código de cima:
const array = ;const callback = function(element) {
console.log(element);
if (element === 2)
return; // would this make a difference? no.
}for (let i = 0; i < array.length; i++) {
callback(array);
}// Output: 1 2 3 4
a declaração returnnão fará qualquer diferença, uma vez que aplicamos a função a cada elemento em cada iteração, portanto não se importa se você saiu uma vez, ou seja, quando o elemento é 2.
você não pode ‘quebrar’
você acha que um loop forEach poderia break no exemplo abaixo?
const array = ;array.forEach(function(element) {
console.log(element);
if (element === 2)
break;
});// Output: Uncaught SyntaxError: Illegal break statement
No, it won’t even run because the break instruction is not technically in a loop.Solução?
basta usar um laço normal for. Ninguém se riria de ti.
const array = ;for (let i = 0; i < array.length; i++) {
console.log(array);
if (array === 2)
break;
}// Output: 1 2
você não pode ‘continuar’
você espera que o código abaixo para saltar a impressão 2 para a consola e mostrar apenas 1 3 4?
const array = ;array.forEach(function (element) {
if (element === 2)
continue;
console.log(element);
});// Output: Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
no, it won’t even run because the continue instruction is not in a loop, similar to the break instruction.Solução?
utilize apenas um ciclo normal for de novo.Foi isso! Espero que tenhas aprendido algo novo hoje.