3 cosas que usted no sabía sobre el bucle forEach en JS

¿usted piensa que usted sabe exactamente cómo el forEach bucle de obras en JS?

Bueno, estos eran mis pensamientos hasta hace poco :» solo un buclefor normal donde puedes usar fácilmente break o return o continue«.

Hoy, te mostraré 3 cosas que es posible que no sepas sobre el bucle forEach.

¿Cree que el siguiente código imprimiría 1 2 y luego se detendría?

array = ;array.forEach(function (element) {
console.log(element);
if (element === 2) 
return;
});// Output: 1 2 3 4

No, no lo hará. Si viene de un entorno Java, probablemente se preguntará ¿cómo es eso posible?

La razón es que estamos pasando una función de devolución de llamada en nuestra función forEach, que se comporta como una función normal y se aplica a cada elemento sin importar si return de uno, es decir, cuando el elemento es 2 en nuestro caso.

De los documentos oficiales de MDN:

No hay forma de detener o romper un bucle forEach() que no sea lanzando una excepción. Si necesita tal comportamiento, el método forEach() es la herramienta incorrecta.

Reescribamos el código desde arriba:

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

La instrucción returnno hará ninguna diferencia, ya que aplicamos la función a cada elemento en cada iteración, por lo tanto, no le importa si salió una vez, es decir, cuando el elemento es 2.

No puede «romper»

¿Cree que un bucleforEach sería break en el siguiente ejemplo?

const array = ;array.forEach(function(element) {
console.log(element);
if (element === 2) 
break;
});// Output: Uncaught SyntaxError: Illegal break statement

No, ni siquiera se ejecutará porque la instrucción break técnicamente no está en bucle.

Solución?

Simplemente use un bucle for normal. Nadie se reiría de ti.

const array = ;for (let i = 0; i < array.length; i++) {
console.log(array);
if (array === 2) 
break;
}// Output: 1 2

No puede «continuar»

¿Espera que el siguiente código omita la impresión 2 en la consola y solo muestre 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, ni siquiera se ejecutará porque la instrucción continue no está en bucle, similar a la instrucción break.

Solución?

Simplemente use un bucle for normal de nuevo.

for (let i = 0; i < array.length; i++) {
if (array === 2) 
continue;
console.log(array);
}// Output: 1 3 4

Eso fue todo! Espero que hayas aprendido algo nuevo hoy.