Terminar un bucle forEach usando excepciones en JavaScript
El lenguaje de programación JavaScript viene con varias variaciones del bucle for, a diferencia de otros lenguajes de programación, solo podemos ver el bucle tradicional for, que consta de 3 cosas: inicialización, condición e incremento o decremento. Tenemos que seguir estos 3 elementos para que funcione un bucle for tradicional. Puede parecer bastante confuso, especialmente si es nuevo en la programación.
JavaScript nos ha proporcionado una nueva forma de escribir el bucle for, y ese es el bucle forEach. El bucle forEach se utiliza para iterar sobre un array. Muchos desarrolladores prefieren usar el bucle forEach sobre el bucle tradicional for para iterar sobre un array porque es mucho más fácil de escribir y es mucho más legible.
Cualquier bucle, ya sea un bucle for o un bucle while, se puede terminar con la ayuda de una instrucción break. El único inconveniente de usar el bucle forEach para iterar sobre un array es que no se puede terminar usando la palabra clave break. Hay ocasiones en las que queremos terminar un bucle forEach cuando alguna condición particular se cumple (verdadera o falsa) durante la ejecución del programa. Entonces, para eso, podemos usar el manejo de excepciones.
Terminar un bucle forEach usando el bloque try...catch en JavaScript
Para lograr la funcionalidad proporcionada por la declaración break dentro del bucle array.forEach, podemos usar el concepto de manejo de excepciones, que está disponible en JavaScript. El manejo de excepciones no es más que manejar condiciones anormales si ocurre algún error mientras se ejecuta un programa y evitar fallas innecesarias del programa. Esto se hace con la ayuda de un bloque try...catch.
El bloque try es donde escribirás todo el código. Y el bloque catch contendrá el código que se utilizará para manejar la excepción.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<p id="errorMsg"></p>
<script>
var arr = [1, 2, 3, 4, 5]
try {
arr.forEach((element)=> {
if (element === 4) throw "number is equal to four";
console.log(element);
});
}
catch (e) {
errorMsg = document.getElementById('errorMsg');
errorMsg.innerHTML = "Error: " + e + ".";
}
</script>
</body>
</html>
Producción :
// The below output will be printed on the screen.
Error: number is equal to four.
// The below output will be printed inside the web browser console
1
2
3
Este es nuestro documento HTML 5. Dentro de la etiqueta <body>. Tenemos una etiqueta de párrafo y el id es errorMsg. Esta etiqueta de párrafo se utilizará para mostrar el mensaje de error que arrojará nuestro programa JavaScript.
Dentro de la etiqueta <script>, tenemos nuestro programa real. Aquí, primero, hemos declarado un array llamada arr, que contiene elementos del 1 al 5. El objetivo principal aquí es iterar sobre esta matriz usando el bucle forEach y luego romper el bucle cuando llega al elemento 4 Dentro del array arr.
En el bloque try, usamos un bucle forEach para iterar sobre esta matriz. Dentro de este bucle, hemos pasado una función anónima (también conocida como función de flecha). Dentro de esa función, tenemos una declaración if para verificar si el elemento en una posición particular en un array es 4 o no. Si no es 4, imprimirá ese elemento en la consola del navegador web; de lo contrario, lanzará una excepción, diciendo que el number is equal to four.
Esta excepción lanzada por el bloque try será capturada por el bloque catch y almacenada dentro de la variable e. Ahora podemos mostrar el mensaje de error presente dentro de la variable e dentro de la etiqueta p con la ayuda de una propiedad HTML llamada innerHTML. Este es un proceso completo de implementación de una funcionalidad break dentro del bucle forEach mientras se itera sobre un array en JavaScript.
Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.
LinkedIn