Saltar la navegación

Salir de un bucle con break

Si deseas salir de un bucle antes de que se hayan completado todas las iteraciones, puedes usar la declaración break. Ya la vimos en el artículo previo cuando revisamos la declaración switch - cuando un caso en una declaración switch coincide con la expresión de entrada, la declaración break inmediatamente sale de la declaración switch y avanza al código que se encuentra después.

Ocurre lo mismo con los bucles - una declaración break saldrá inmediatamente del bucle y hará que el navegador siga con el código que sigue después.

Digamos que queremos buscar a través de un arreglo de contactos y números telefónicos y retornar sólo el número que queríamos encontrar. primero, un simple HTML - un <input> de texto que nos permita ingresar un nombre para buscar, un elemento <button> para enviar la búsqueda, y un elemento <p> para mostrar el resultado:

Ahora en el JavaScript:

Ver Resultado

  • En primer lugar, tenemos algunas definiciones de variables: tenemos una serie de información de contacto, y cada elemento es una cadena que contiene un nombre y un número de teléfono separados por dos puntos.
  • A continuación, adjuntamos un detector de eventos al botón (btn), de modo que cuando se presiona, se ejecuta algún código para realizar la búsqueda y devolver los resultados.
  • Almacenamos el valor ingresado en la entrada de texto en una variable llamada searchName, antes de vaciar la entrada de texto y enfocarla nuevamente, lista para la siguiente búsqueda.
  • Ahora vamos a la parte interesante, el bucle for:
  • Comenzamos el contador en 0, ejecutamos el ciclo hasta que el contador ya no sea menor que contacts.length e incrementamos i en 1 después de cada iteración del ciclo.
  • Dentro del bucle, primero dividimos el contacto actual (contactos [i]) en el carácter de dos puntos y almacenamos los dos valores resultantes en una matriz llamada splitContact.
  • Luego usamos una declaración condicional para probar si splitContact[0] (el nombre del contacto) es igual al nombre de búsqueda ingresado. Si es así, ingresamos una cadena en el párrafo para informar cuál es el número del contacto y usamos break para finalizar el ciclo.
  • Si el nombre del contacto no coincide con la búsqueda ingresada, el texto del párrafo se establece en 'Contacto no encontrado' y el bucle continúa iterando.