Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. JavaScript

Aprende Ciencias Computacionales con JavaScript: Parte 3, Bucles

by
Difficulty:BeginnerLength:ShortLanguages:
This post is part of a series called Learn Computer Science with JavaScript.
Learn Computer Science With JavaScript: Part 4, Functions

Spanish (Español) translation by Ana Paulina Figueroa Vazquez (you can also view the original English article)

Introducción

Supongamos que te han asignado la tarea de escribir un programa que muestre los números del 1 al 100. Una manera en la que podrías lograrlo es escribiendo 100 sentencias console.log. Pero estoy segura de que no lo harías así, ya que te habrías cansado al llegar a la novena o a la décima línea.

La única parte que cambia en cada sentencia es el número, por lo que debe haber una manera de escribir solamente una sentencia. Y la hay, usando bucles. Los bucles nos permiten ejecutar un conjunto de pasos en un bloque de código repetidamente.

Contenido

  • Bucles while
  • Bucles do-while
  • Bucles for
  • Arreglos
  • Bucles for-in
  • Bucles for-of
  • Resumen
  • Recursos

Bucles while

Los bucles while ejecutarán un conjunto de sentencias repetidamente mientras que una condición sea verdadera. Cuando la condición sea falsa el programa saldrá del bucle. Este tipo de bucle verifica la condición antes de llevar a cabo una iteración. Una iteración es una ejecución del cuerpo del bucle. El siguiente ejemplo no mostrará nada debido a que nuestra condición es falsa.

Este es el formato general de un bucle while:

Al usar bucles while debes tener cuidado de no crear bucles que nunca terminen. Esto ocurre debido a que la condición nunca se vuelve falsa. Tu programa se bloqueará si te sucede esto. Ejemplo:

Tarea

¿Cuántas veces se ejecutará el cuerpo de este bucle?:

Bucles do-while

Un bucle do-while ejecutará el cuerpo de sentencias primero y después verificará la condición. Este tipo de bucle es útil cuando sabes que quieres ejecutar el código al menos una vez. El siguiente ejemplo mostrará la palabra "eat" ("comer") una vez, a pesar de que la condición es falsa.

Este es el formato general de un bucle do-while:

Tarea

Escribe un bucle do-while que muestre los números del 1 al 10.

Bucles for

Un bucle for repetirá la ejecución de un bloque de código un número específico de veces. El siguiente ejemplo muestra los números del 1 al 10:

Este es el formato general de un bucle for:

Initial (Inicial) es una expresión que establece el valor de nuestra variable. Condition (Condición) es una expresión que debe ser verdadera para que las sentencias se ejecuten. Y step (Incremento) es una expresión que incrementa el valor de nuestra variable.

Un modelo de programación es el uso de un bucle for para actualizar el valor de una variable con ella misma y con un valor nuevo. Este ejemplo suma los números del 1 al 10.

El += es un operador de asignación que suma un valor a una variable. Esta es una lista de todos los operadores de asignación:

Operador
Ejemplo
Equivalente
+= x += 2
x = x + 2
-= x -= 2
x = x - 2
*= x *= 2
x = x * 2
/= x /= 2
x = x / 2
%= x %= 2
x = x % 2

Tarea

Escribe un bucle for que calcule el factorial de un número. El factorial de un número n es el producto de todos los enteros desde 1 hasta n. Por ejemplo, 4! (4 factorial) es 1 x 2 x 3 x 4, que es igual a 24.

Arreglos

Un arreglo es un objeto que contiene una lista de unidades, que se conocen como elementos, y a los que se accede a través de su índice. El índice es la posición del elemento en el arreglo. El primer elemento se encuentra en el índice 0. Las siguientes son operaciones comunes con arreglos.

Crear un arreglo vacío:

Inicializar un arreglo con valores:

Obtener un elemento de un arreglo:

Actualizar un elemento en un arreglo:

Recorrer un arreglo usando un bucle:

Un arreglo bidimensional es aquel cuyos elementos son arreglos. Ejemplo:

Esta es la forma en la que podrías recorrer el arreglo con un bucle y mostrar cada elemento:

Tarea

¿Qué elemento se muestra cuando i = 1 y j = 0 en el bucle for anterior?

Bucle for-in

Este tipo de bucle nos permite movernos a través de las claves de un objeto. Un objeto es una estructura de datos que tiene claves asignadas a valores. Estas son algunas operaciones comunes que pueden efectuarse en un objeto.

Crear un objeto vacío:

Inicializar un objeto con valores:

Obtener una propiedad de un objeto:

Actualizar una propiedad en un objeto:

Recorrer las claves de un objeto usando un bucle:

Tarea

¿Qué es lo que muestra el bucle anterior dado el objeto obj = {foo: "Hello", bar: "World"}?

Bucle for-of

Este tipo de bucle nos permite desplazarnos a través de los valores de objetos iterables. Los arreglos y las cadenas son ejemplos de objetos iterables.

Desplazamiento a través de un arreglo usando un bucle:

Desplazamiento a través de una cadena usando un bucle:

Tarea

Escribe un programa que muestre este patrón de escalera usando cualquiera de los bucles:

Resumen

Los bucles nos permiten reducir la duplicación en nuestro código. Los bucles while nos permiten repetir una acción hasta que una condición sea falsa. Un bucle do-while se ejecutará al menos una vez. Los bucles for nos permiten repetir una acción hasta que lleguemos al final de un contador. El bucle for-in está diseñado para que podamos acceder a las claves de un objeto. El bucle for-of está diseñado para que podamos obtener el valor de un objeto iterable.

A continuación, en la parte 4, aprenderemos acerca de las funciones.

Recursos

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.