Javascript Logo
en español

Cómo romper loops en JavaScript

Fácil
-
2 min. lectura

Cuando trabajamos con bucles en JavaScript, puede que en algún momento necesitemos detener la ejecución del loop antes de que haya terminado. Para esto, existen diferentes métodos que podemos utilizar según el tipo de loop que estemos utilizando. Veamos algunos ejemplos.

Break en loops for

El loop for es uno de los bucles más utilizados en JavaScript. Si queremos detener la ejecución del loop for en un momento determinado, podemos utilizar la palabra reservada break.

for (let i = 0; i < 10; i++) {
  console.log(i);
  if (i === 5) {
    break;
  }
}

Este loop for se ejecutará 10 veces, pero cuando i sea igual a 5, se ejecutará la instrucción break y se detendrá la ejecución del loop.

Break en loops for...in y for...of

Los loops for...in y for...of se utilizan para recorrer elementos de un objeto y un array, respectivamente. Para detener la ejecución de estos loops, podemos utilizar igualmente a palabra reservada break .

const myArray = [1, 2, 3, 4, 5];

for (const element of myArray) {
  console.log(element);
  if (element === 3) {
    break;
  }
}

En este ejemplo, el loop for...of se ejecutará hasta que encuentre el elemento 3, momento en el que se ejecutará la instrucción break y se detendrá la ejecución del loop.

Continue en loops for, for...in y for...of

Además de break, también existe la palabra reservada continue, que se utiliza para saltar una iteración en un bucle. En el caso de los bucles for, for...in y for...of, continue se puede utilizar para omitir el procesamiento de un elemento específico y continuar con el siguiente.

const myArray = [1, 2, 3, 4, 5];

for (const element of myArray) {
  if (element === 3) {
    continue;
  }
  console.log(element);
}

Etiquetas para break y continue en bucles anidados

En situaciones en las que tenemos bucles anidados, es posible que necesitemos romper o saltar un bucle interno o externo específico. Para hacer esto, podemos utilizar etiquetas en nuestras instrucciones break y continue.

Una etiqueta es simplemente una identificación que se le da a un bucle específico utilizando un nombre personalizado. Luego, podemos utilizar esta etiqueta en nuestra instrucción break o continue para especificar qué bucle se debe interrumpir o saltar.

outerLoop: for (let i = 1; i <= 3; i++) {
  innerLoop: for (let j = 1; j <= 3; j++) {
    console.log(`i: ${i}, j: ${j}`);
    if (i === 2 && j === 2) {
      break outerLoop;
    }
  }
}

En este ejemplo, tenemos dos bucles anidados: el outerLoop y el innerLoop. El bucle outerLoop se ejecutará tres veces, y cada vez que se ejecute, el bucle innerLoop se ejecutará tres veces. En cada iteración del bucle, imprimimos en la consola el valor de i y j.

Si la condición i === 2 && j === 2 se cumple, se ejecutará la instrucción break con la etiqueta outerLoop. Esto significa que se interrumpirá el bucle outerLoop, y la ejecución del código se reanudará después de la etiqueta outerLoop.

¿Son prácticas recomendadas?

Utilizar break para detener la ejecución de bucles y métodos es una práctica común y aceptada en JavaScript. Sin embargo, es importante utilizarlos con cuidado y solo cuando sea necesario, ya que pueden afectar el rendimiento y la legibilidad del código.

En general, es recomendable utilizar bucles y métodos que se ajusten a nuestras necesidades y evitar el uso de instrucciones de detención a menos que sea estrictamente necesario.