Capítulo 2

Estructura del Programa

Y mi corazón brilla rojo debajo de mi delgada, translúcida piel y tienen que administrarme 10cc de JavaScript para hacerme regresar (respondo bien a las toxinas en la sangre). ¡Hombre, esa cosa te sacará de tus casillas!

En este capítulo, vamos a empezar a hacer cosas que realmente pueden ser llamadas programación. Vamos a ampliar nuestro conocimiento del lenguaje JavaScript, más allá de los sustantivos y fragmentos de oraciones que hemos visto hasta ahora, hasta el punto en que podamos expresar alguna prosa significativa.

Expresiones y declaraciones

En el Capítulo 1, creamos algunos valores y después les aplicamos operadores para obtener nuevos valores. Crear valores de esta forma es una parte esencial de cada programa de JavaScript, pero esto es sólo una parte.

Un fragmento de código que produce un valor es llamado una expresión. Cada valor que se escribe literalmente (tal como 22 o "psicoanálisis") es una expresión. Una expresión entre paréntesis es también una expresión, como un operador binario aplicado a dos expresiones o un operador unario aplicado a una expresion.

Esto muestra parte de la belleza de una interfaz basada en el lenguaje. Las expresiones se pueden anidar en una forma muy similar a la forma de sub-frases en la que las lenguas humanas son anidadas, y las sub-frases pueden contener sus propias sub-frases, etc. Esto nos permite combinar expresiones para expresar cálculos arbitrariamente complejos.

Si una expresión corresponde a un fragmento de frase, una declaración en JavaScript corresponde a una frase completa en un lenguaje humano. Un programa es simplemente una lista de declaraciones.

El tipo más simple de declaración es una expresión con un punto y coma después de ella. Esto es un programa:

1;
!false;

Sin embargo, es un programa inútil. Una expresión puede estar presente para sólo producir un valor, que puede entonces ser utilizado por la expresión que la contiene. Una declaración existe por sí sola y que equivale a algo sólo si afecta al mundo. Podría mostrar algo en la pantalla -que cuenta como cambiar el mundo_ o podría cambiar el estado interno de la máquina de estados de manera que afectará las declaraciones que vienen despues de ella. Estos cambios se llaman efectos colaterales. Las declaraciones en el ejemplo anterior solo producen los valores 1 y verdadero y los desechan inmediatamente. Esto no deja ningún cambio en el mundo en absoluto. Al ejecutar el programa, nada observable sucede.

En algunos casos, JavaScript te permite omitir el punto y coma al final de una declaración. En otros casos, tiene que estar allí, o la siguiente linea será tratada como parte de la misma declaración. Las reglas para cuando se puede omitir con seguridad son algo complejas y propensas a errores. En este libro, cada declaración que necesite un punto y coma siempre será terminada por un punto y coma4. Te recomiendo que hagas lo mismo en tus propios programas, al menos hasta que hayas aprendido más sobre sutilezas involucradas en omitir el punto y coma.

Variables

¿Cómo mantiene un programa su estado interno? ¿Cómo recuerda algo? Hemos visto cómo producir nuevos valores de viejos valores, pero esto no cambia los valores antiguos, y el nuevo valor tiene que ser inmediatamente utilizado o se disipará de nuevo. Para atrapar y mantener los valores, JavaScript proporciona una cosa llamada variable.

var atrapado = 5 * 5;

Y eso nos da nuestra segunda clase de declaración. La palabra especial(palabra clave o keyword) var indica que esta frase va a definir una variable. Es seguida por el nombre de la variable y, si queremos dar de inmediato un valor, con un operador de = y una expresión.

La declaración anterior crea una variable llamada atrapado y se usa para retener el número que se produce al multiplicar 5 por 5.

Después de que una variable se ha definido, su nombre puede ser usado como una expresión. El valor de esa expresión es el valor que la variable alberga actualmente. He aquí un ejemplo:

var diez = 10;
console.log(diez * diez);
// → 100

Los nombres de variables pueden ser cualquier palabra que no sea una palabra clave (tal como var). Estos no pueden incluir espacios. Los dígitos también pueden ser parte de la variable nombre —catch22 es un nombre válido, por ejemplo-, pero el nombre no debe comenzar con un dígito. Un nombre de variable no puede incluir puntuación, a excepción de los caracteres $ y _.

(((variable,asiganción))Cuando una variable apunta a un valor, eso no quiere decir que está ligada a ese valor para siempre. El operador = se puede utilizar en cualquier momento en variables existentes para desconectarlas de su valor actual y apuntarlas a uno nuevo.

var tono = "claro";
console.log(tono);
// → claro
tono = "oscuro";
console.log(tono);
// → oscuro

Podrías imaginar las variables como tentáculos, en lugar de la cajas. Estas no contienen valores; los agarran; dos variables pueden referirse al mismo valor. Un programa puede acceder sólo los valores que todavía mantiene detenidos. Cuando necesitas recordar algo, haces crecer un tentáculo para agarrarlo o cambias unos de tus tentáculos existentes para agarrarlo.

Veamos un ejemplo. Para recordar el número de dólares que Luigi aún te debe, se crea una variable. Y luego, cuando te paga $35, le das a esta variable un valor nuevo.

var deudaDeLuigi = 140;
deudaDeLuigi = deudaDeLuigi - 35;
console.log(deudaDeLuigi);
// → 105

Cuando se define una variable sin darle un valor, el tentáculo no tiene nada que sostener, por lo que termina en el aire. Si preguntas por el valor de una variable vacía, obtendrás el valor undefined (indefinido).

Una sola declaración var puede definir múltiples variables. Las definiciones deben estar separadas por comas.

var uno = 1, dos = 2;
console.log(uno + dos);
// → 3

Palabras clave y palabras reservadas

Palabras con un significado especial, como var, son palabras clave, y no pueden ser utilizadas como nombres de variables. También hay un número de palabras que son “reservadas para uso” en futuras versiones de JavaScript. Estas también están oficialmente no permitidas como nombres de variables, aunque algunos entornos de JavaScript las permiten. La lista completa de palabras clave y palabras reservadas es bastante larga.

break case catch class const continue debugger
default delete do else enum export extends false
finally for function if implements import in
instanceof interface let new null package private
protected public return static super switch this
throw true try typeof var void while with yield

No te preocupes por memorizarlas, pero recuerda que esto podría ser el problema cuando una definición de variable no funcione como se esperaba.

El entorno

La colección de variables y sus valores que existe en un momento dado se llama el entorno. Cuando un programa se pone en marcha, este entorno no está vacío. Siempre contiene variables que forman parte del lenguaje estándar, y la mayoría del tiempo, contiene variables que proporcionan formas de interactuar con el sistema que lo contiene. Por ejemplo, en un navegador, existen variables y funciones para inspeccionar e influir en la página web cargada en ese momento y leer entrada del ratón y del teclado.

Funciones

Una gran cantidad de los valores proporcionados en el entorno por defecto tienen el tipo function. Una función(function) es un pedazo de programa encerrado en un valor. Tales valores pueden ser aplicados con el fin de ejecutar el programa envuelto. Por ejemplo, en un entorno de navegador, la variable alert contiene una función que muestra un pequeño cuadro de diálogo con un mensaje. Se utiliza como sigue:

alert("¡Good Morning!");

La ejecución de una función es denominada invocar, llamar, o aplicar la función. Puedes llamar a una función poniendo paréntesis después de una expresión que produce un valor de la función. Por lo general, se usa directamente el nombre de la variable que contiene la función. Los valores entre paréntesis se le pasan a el programa dentro de la función. En el ejemplo, la función alert utiliza la cadena que le damos como el texto que se mostrará en el cuadro de diálogo. Los valores dados a las funciones se denominan argumentos. La función alert necesita solo uno, pero otras funciones pueden necesitar un número diferente o diferentes tipos de argumentos.

La función console.log

La función alert puede ser útil para imprimir cuando estamos experimentando, pero quitar del camino todas esas pequeñas ventanas puede desesperarte. En ejemplos pasados, hemos usado console.log para devolver valores. La mayoría sistemas JavaScript (incluyendo a todos los navegadores web modernos y a Node.js) nos dan una función console.log que imprime sus argumentos en algún dispositivo de salida de texto. En los navegadores la salida queda en la consola de JavaScript. Esta parte del navegador está escondida por defecto, pero la mayoría de los navegadores la abren cuando presionas F12 o, en Mac, cuando presionas Command-Option-I. Si esto no funciona, busca en los menús un item llamado "Consola Web" o "Herramientas de Desarrollador".

Cuando corras los ejemplos, o tu propio código, en las páginas de este libro, la salida de console.log será mostrada después del ejemplo, en vez de en la consola de JavaScript del navegador.

var x = 30;
console.log("el valor de x es", x);
// → el valor de x es 30

Aunque los nombres de variable no pueden contener el caracter punto, console.log claramente tiene uno. Esto es porque console.log no es una variable simple. Es en realidad una expresión que trae la propiedad log del valor mantenido por la variable console. Veremos que significa exactamente en el Capítulo 4.

Valores de Retorno

Mostrar un cuadro de diálogo o escribir texto en la pantalla es un efecto secundario. Muchas funciones son útiles porque producen valores, y en ese caso, no necesitan tener un efecto secundario para ser útiles. Por ejemplo, la función Math.max toma un número indeterminado de números y regresa el más grande.

console.log(Math.max(2, 4));
// → 4

Cuando una función produce un valor, se dice que regresa ese valor. Cualquier cosa que produce un valor es una expresión en JavaScript, lo que significa que puede ser usada dentro de expresiones más grandes. Aquí, una llamada a Math.min, que es lo opuesto a Math.max, es usada como entrada de un operador de suma:

console.log(Math.min(2, 4) + 100);
// → 102

El próximo capítulo explica como escribir tus propias funciones.

Pedir información y confirmar

Los entornos de navegador tienen otras funciones más allá de alert para mostrar ventanas. Puedes preguntar al usuario una cuestión estilo OK/Cancelar usando confirm. Esto regresa un Booleano: true si el usuario hace click en OK y false si el usuario presiona en Cancelar.

confirm("¿Entonces, deberíamos?");

La función prompt puede ser usada para hacer una pregunta "abierta". El primer argumento es la pregunta, el segundo es un texto con el que usuario inicia. Se puede escribir una línea de texto en el cuadro de diálogo, y la función regresará este texto como una cadena.

prompt("Tell me everything you know.", "...");

Estas dos funciones no son usadas mucho en la programación web moderna, principalmente porque no tienes control sobre la forma en que las ventanas resultantes se verán, pero son útiles para programas de prueba y experimentos.

Control de flujo

Cuando tu programa contiene más de una sentencia, las sentencias son ejecutadas (fácil de predecir), de arriba hacia abajo. Como un ejemplo básico, este programa tiene dos sentencias. La primera le pide un número al usuario, y la segunda, que se ejecuta después, muestra el cuadrado de ese número

var elNumero = Number(prompt("Dame un número", ""));
alert("Tú número es la raíz cuadrada de " +
      elNumero * elNumero);

La función Numero convierte un valor a un número. Necesitamos esa conversión porque el resultado de prompt es un valor de cadena de texto (string), y queremos un número. Hay funciones similares llamadas String y Boolean que convierten valores a estos tipos.

Aquí está la trivial representación esquemática de un flojo de control recto.

Ejecución Condicional

Ejecutar sentencia en línea recta no es la íunica opción que tenemos. Una alternativa es la ejecución condicional, en dondne escogemos entre dos rutas diferentes basados en un valor Booleano, como el siguiente:

La ejecución condicional se escribe con la palabra clave if en JavaScript. En el caso sencillo, queremos que algo de código se ejecute si, y sólo si, cierta condición se cumple. Por ejemplo, en el programa previo, podríamos querer mostrar el cuadrado de la entrada sólo si la entrada es un número.

var elNumero = Number(prompt("Dame un número", ""));
if (!isNaN(elNumero))
  alert("Tu número es la raíz cuadrada de " +
        elNumero * elNumero);

Con esta modificación, si le das "queso", no se mostrará ninguna salida.

La palabra clave if ejecuta o salta una sentencia dependiendo del valor de una expresión Booleana. La expresión de decisión se escribe después de la palabra clave, entre parántesis, seguida por una sentencia a ejecutar.

La función isNaN es una función estándar de JavaScript que regresa true sólo si el argumento que le diste es NaN. Resulta que la función Number regresa NaN cuando le das una cadena que no “a menos que elNumero no sea un número, has esto”.

A menudo no sólo tendrás código que se ejecute cuando una condición sea verdadera, sino también que maneje el otro caso. Este camino alternativo es representado por la segunda flecha en el diagrama. La palabra clave else puede ser usada, junto con if, para crear dos rutas de ejecución separadas y alternativas.

var elNumero = Number(prompt("Dame un número", ""));
if (!isNaN(elNumero))
  alert("Tu número es la raíz cuadrada de " +
        elNumero * elNumero);
else
  alert("Hey. ¿Por qué no me diste un número?");

Si tenemos más de dos caminos a escoger, varios pares de if/else pueden ser "encadenados". Aquí hay un ejemplo:

var num = Number(prompt("Dame un número", "0"));

if (num < 10)
  alert("Chico");
else if (num < 100)
  alert("Mediano");
else
  alert("Grande");

El programa primero checará sí num es menor que 10. Si lo es, escoge ese camino, muestra "Chico" y termina. Si no lo es, toma el el branch else, que en sí mismo contiene un segundo if. Si la segunda condición (< 100) se cumple, significa que el número está entre 10 y 100, y se muestra "Mediano". Si no lo es, el segundo y último else es escogido.

El diagrama de flujo para este programa es algo así:

bucles while y do

Piensa en un programa que imprima todos los números primos del 1 al 12. Una manera de escribirlo sería como sigue:

console.log(0);
console.log(2);
console.log(4);
console.log(6);
console.log(8);
console.log(10);
console.log(12);

Eso funciona, pero la idea de escribir un programa es trabajar menos, no más. Si necesitamos todos los números menores que 1,000, lo anterior sería imposible de trabajar. Lo que necesitamos es una forma de repetir algo de código. Esta forma de control de flujo es llamada bucle:

El control de flujo por bucles nos permite regresar a cierto punto en el progrma en el que estuvimos antes y repetirlo con nuestro estado actual. Si combinamos esto con una variable que mantenga una cuenta, podemos hacer algo como lo siguiente:

var numero = 0;
while (numero <= 12) {
  console.log(numero);
  numero = numero + 2;
}
// → 0
// → 2
//   … etcetera

Una sentencia que comienza con la palabra clave while crea un bucle. Después de while viene una expresión en paréntesis y después una sentencia, muy parecido a el if. El bucle ejecuta la sentencia mientras la expresión produzca un valor que sea true cuando se convierta a un tipo Booleano.

En este bucle, queremos tanto imprimir el número como sumar dos a nuestra variable. Cuando necesitamos ejecutar múltiples sentencias dentro de un bucle, lo encerramos en llaves ({ y }). Las llaves hacen por las sentencias lo que los paréntesis hacen por las expresiones: las agrupan, haciéndolos valer por una sola sentencia. Una secuencia de sentencias encerradas en llaves es llamada un bloque.

Muchos programadores de JavaScript encierran cada cuerpo de un bucle o if en llaves. Lo hacen en nombre de la consistencia y para evitar tener que añadir o quitar las llaves cuando el número de sentencias en el cuerpo cambie. En este libro escribiré la mayoría de los cuerpos de una sola sentencia sin bloques, porque valoro la brevedad. Tú eres libre de usar el estilo que prefieras.

La variable número demuestra la forma en que una variable puede dar seguimiento al progreso de un programa. Cada vez que el bucle se repite, numero se incrementa en 2. Entonces, al principio de cada repetición. es comparada con el número 12 para decidir si el programa ha hecho todo el trabajo que tenía que hacer.

Como un ejemplo que hace realmente algo útil, podemos escribir un programa que calcula y mustra el valor de 2^10 (dos a la décima potencia). Usamos dos varianles: una para mantener el resultado y una para contar cuantas veces hemos multiplicado este resultado por dos. El bucle verifica si la segunda variable ha llegado a 10 y entonces actualiza las dos variables.

var resultado = 1;
var contador = 0;
while (contador < 10) {
  resultado = resultado * 2;
  contador = contador + 1;
}
console.log(resultado);
// → 1024

El contador pudo también empezar en 1 y verificar que <=10, pero, por razones que se aclararán en el Capítulo 4, es una buena idea acostumbrarse a contar desde 0.

El bucle do es una estructura de control similar al bucle while. Se diferencia en sólo un punto: un bucle do siempre ejecuta su cuerpo por lo menos una vez y empieza a verificar si debería para sólo después de la primera ejecución. Para reflejar esto, la condición aprece después del cuerpo del bucle:

do {
  var tuNombre = prompt("¿Quién eres?");
} while (!tuNombre);
console.log(tuNombre);

Este programa te obligará a introducir un nombre. Preguntará una y otra vez hasta que obtenga algo que no sea una cadena vacía. Aplicar el operador ! convierte un valor a Booleano negándolo y todas las cadenas excepto "" se convierten a true. Esto significa qie el bucle continúa corriendo hasta que des un nombre que no sea una cadena vacía.

Indentando código

Probablemente has notado los espacios que pongo en frente de algunas sentencias. En JavaScript, no son requeridos, la computadora aceptaré el programa bien sin ellos. De hecho, incluso los saltos de línea en los programas son opcionales. Puedes escribir un programa en una sola línea si así lo prefieres. El rol de la indentación dentro de los bloques es hacer notar la estructura del código. En código complejo, en dónde nuevos bloques son abiertos dentro de otros bloques, puede ser difícil de ver en dónde termina uno y empieza otro. Con la indentación correcta, la forma visual del programa se corresponde con la forma de los bloques dentro de él. A mí me gusta usar dos espacios por cada bloque abierto, pero los gustos varían; algunas personas usan cuatro espacios, y algunas otras usan el carácter tab.

Bucles for

Muchos bucles siguen el patrón de los ejemplos previos del while. Primero, una variable “contador” es creada para dar seguimiento al progreso del bucle. Entonces viene el bucle while, cuya expresión condicional normamelte verifica si el contador ha alcanzafo cierto límite. El final del cuerpo del bucle, el contador es actualizado para dar seguimiento al progreso.

Debido a que este patrón es tan común, JavaScript y otros lenguajes similares proveen una versión un poco más corta y más completa, el bucle for.

for (var numero = 0; numero <= 12; numero = numero + 2)
  console.log(numero);
// → 0
// → 2
//   … etc.

Este programa es exactamente equivalente a el ejemplo previo de impresión de números pares. El único cambio es que todas las sentencias que están relacionadas con el "estado" del bucle están agrupadas.

Los paréntesis después de una palabra clave for tienen que contener dos punto y coma. La parte que está antes del primer punto y coma inicializa el bucle, normalmente al definir una variable. La segunda parte es la expresión que verifica si el bucle tiene que continuar. La parte final actualiza el estado del bucle antes de cada iteración. En la mayoría de los casos, esto es más corto y claro que una construcción con while.

Aquí está un código que calcula 2¹⁰, usando el for en vez del while.

var resultado = 1;
for (var contador = 0; contador < 10; contador = contador + 1)
  resultado = resultado * 2;
console.log(resultado);
// → 1024

Nota que incluso aunque no se abrió ningún bloque con un {, la sentencia del bucle está indentada dos espacios para dejar claro que "pertenece" al la línea que está antes de ella.

Forzando la salida de un bucle

Hacer que la condición del bucle produzca false no es la única forma de que un bucle termine. Existe una una sentencia especial llamada break que tiene el efecto de salir inmediatamente del bucle que la esté encerrando.

El siguiente programa ilustra la sentencia break. Encuentra el primer número que es más grande o igual que 20 y divisible por 7.

for (var actual = 20; ; actual++) {
  if (actual % 7 == 0)
    break;
}
console.log(actual);
// → 21

Usar el operador de sobrante o módulo (%) es una forma fácil de probar si un número es divisible por otro. Si lo es, el sobrante de la división es cero.

La construcción for en este ejemplo no tiene la parte que verifica si el bucle debe terminar. Esto significa que el loop nunca terminará hasta que la sentencia break que está adentro sea ejecutada.

Si dejaras afuera esa sentencia break o accidentalmente escribieras una condición que siempre produzca true, tu programa se quedaría atorado en un bucle infinito. Un programa que se queda en un bucle infinito nunca terminará de correr, y eso usualmente es malo.

Si creas un bucle infinito en uno de los ejemplos de estas páginas, usualmente se te preguntará si quieres detener el script después de unos cuantos segundos. Si eso falla, tendrás que cerrar la pestaña en la que estás trabajando, o, en otros nevagadores, cerrar el navegador entero para recuperarte.

La palabra clave continue es similar a break en que influencia el progreso del bucle. Cuando se encuentra continue en el cuerpo de un bucle, el control sale del curpo del bucle inmediatamente y continúa en la próxima iteración del bucle.

Actualizando variables sucintamente

Especialmente cuando estamos en un bucle, un programa necesita "actualizar" una variable para mantener un valor basado en el valor previo de esa variable.

contador = contador + 1;

JavaScript nos da un atajo para esto:

contador += 1;

Atajos similares funcionan igual para muchos otros operadores, como resultado *= 2 para duplicar resultado o counter -= 1 para restar uno.

Esto nos permite acortar nuestro ejemplo de la cuenta un poco más.

for (var numero = 0; numero <= 12; numero += 2)
  console.log(numero);

Para contador += 1 y contador -= 1, hay incluso equivalentes más cortos: contador+= y contador--.

Despachando sobre un valor con switch

Es común ver código así:

if (variable == "valor1") accion1();
else if (variable == "valor2") accion2();
else if (variable == "valor3") accion3();
else accionDefault();

Existe una estructura llamada switch que está hecha para resolver este "despachado" de un modo más directo. Desafortunadamente, la sintaxis que JavaScript usa para esto (que es heredada de la línea de lenguajes de programación de C o Java) es un poco incómoda; una cadena de sentencias if a menudo luce mejor. Aquí hay un ejemplo:

switch (prompt("¿Cómo está el clima?")) {
  case "lluvioso":
    console.log("Recuerda llevar un paraguas.");
    break;
  case "soleado":
    console.log("Viste ligero.");
  case "nublado":
    console.log("Sal a la calle.");
    break;
  default:
    console.log("Tipo de Clima desconocido.");
    break;
}

Puedes poner cualquier cantidad de etiquetas case dentro del bloque switch abierto. El programa saltará a la etiqueta que corresponda al valor que se le dio al switch o a default si no se encuentra valor que corresponda. Se empiezan a ejecutar las sentencias desde ahí, incluso si están bajo otra etiqueta, hasta que se llegue a una sentencia breal. En algunos casos, como en el caso de "soleado" en el ejemplo, esto puede ser usado para compartir código entre casos (recomienda salir a la calle tanto para clima soleado como para nublado). Pero cuidado: es fácil olvidar el break, lo cuál causará que el programa ejecute código que no quieres que se ejecute.

Capitalización

Los nombres de variable no pueden contener espacios, pero aún así es útil ocupar varias palabras para describir claramente lo que esa variable representa. Estas son tus elecciones para escribir un nombre de variable con varias palabras:

toortuguitadifusa
tortuguita_difusa
TortuguitaDifusa
tortuguitaDifusa

El primer estilo puede ser difícil de leer. Personalmente, me gusta como luce con los guiones bajos, aunque es un poco difícil de escribir. Las funciones estándar de JavaScript, y la mayoría de los programadores de JavaScript, siguen el último estilo; capitalizan cada palabra excepto la primera. No es difícil acostumbrarse a pequeñas cosas como esas y código con estilos de nombrado mezclados puede ser desagradable de leer, así que simplemente seguiremos esta convención.

En algunos casos, como en el de la función Number, la primera letra de una variable también es mayúscula. Esto fue hecho para marcar la función como un constructor. Lo que es un constructor, quedará claro en el Capítulo 6. Por ahora, lo importante es no preocuparse por esta aparente falta de consistencia.

Comentarios

A menudo, el código por sí mismo no transmite toda la información que quieres que un programa transmita para los lectores humanos, o la transmite de un modo tan críptico que las personas podrían no entenderlo. En otras ocasiones, simplemente puedieras sentirte poético o quisieras incluir algunos pensamientos como parte del programa. Para eso son los comentarios.

Un comentario es una pieza de texto que es parte del programa pero es completamente ignorado por la computadora. JavaScript tiene dos formas para escribir comentarios. Para escribir un comentario de una línea, puedes usar dos diagonales (//) con el texto después.

var balandeDeCuenta = calcularBalance(cuenta);
// Es en un claro de bosque donde canta un río.
balandeDeCuenta.ajustar();
// Cuelgan enloquecidamente de la hierbas harapos
var reporte = new Reporte();
// De plata; donde el sol de la orgullosa montaña
agregaAReporte(balandeDeCuenta, reporte);
// Luce: Es un pequeño valle espumoso de luz.

Un // sólo es válido hasta el fin de la línea. Una sección de texto entre /* y */ será ignorada, sin importar si contiene saltos de línea. Esto es útil a menudo para añadir bloques de información acerca de un archivo o un pedazo de un programa.

/*
 Primero, encontré este número garabateado en la parte trasera de
 una de mis libretas hace unos cuantos años. Desde entonces,
 a menudo ha aparecido de la nada, apareciendo en números de
 teléfono y números de serie de productos que he comprado.
 Obviamente le gusto, así que decidí conservarlo.
*/
var miNumero = 11213;

Sumario

Ya sabes que un programa está construido de sentencias, que a su vez pueden contener más sentencias algunas veces. Las sentencias normalmente contienen expresiones, que a su vez pueden contener expresiones más pequeñas.

Colocar una sentencia tras otras te da un programa que es ejecutado de arriba hacia abajo. Puedes introducir disturbios en el flujo de control usando sentencias condicionales (if, else, and switch) y de bucle (while, do, and for).

Las variables pueden ser usadas para guardar piezas de información bajo un nombre, y son útiles para llevar registro del estado del programa. El entorno es el conjunto de variables que están definidas. Los sistemas de JavaScript siempre colocan varias variables estándar útiles en tu entorno.

Las funciones son valores especiales que encapsulan un pedazo del programa. Puedes invocar una escribiendo nombreDeLaFuncion(argumento1, argumento2). Esta llamada a la función es una expresión, y podría producir un valor.

Ejercicios

Si no estás seguro de cómo probar tus soluciones a los ejercicios, visita la introducción

Cada ejercicio empieza con una descripción del problema. Léela e intenta resolver el ejercicio. Si tienes problemas, considera leer las pistas después del ejercicio. Las soluciones completas a los ejercicios no están incluidas en este libro, pero puedes encontrarlas en línea en eloquentjavascript.net/code. Si quieres aprender a partir de los ejercicios, recomiendo mirar las soluciones sólo después de que hayas resuelto el ejercicio, o al menos lo hayas atacado con el tiempo y esfuerzo suficientes para tener un pequeño dolor de cabeza.

Iterando un triángulo

Escribe un bucle que haga siete llamadas a console.log para producir el siguiente triángulo:

#
##
###
####
#####
######
#######

Puede ser útil saber que puedes encontrar la longitud de una cadena de texto escribiendo .length después de ella.

var abc = "abc";
console.log(abc.length);
// → 3

La mayoría de los ejercicios contienen una porción de código que puedes modificar para resolver el ejercicio. Recuerda que puedes hacer click en los bloques de código para editarlos.

// Tu código aquí:

FizzBuzz

Escribe un programa que use console.log para imprimir todos los números del 1 al 100, con dos excepciones. Para números divisibles por 3, imprime "Fizz" en vez del número y para números divisibles por 5 (pero no por 3), imprime "Buzz".

Cuando tengas eso funcionando, modifica tu programa para imprimir "FizzBuzz", para números que sean divisibles tanto por 3 como por 5 (y que siga imprimiendo "Fizz" o "Buzz" para números divisibles por sólo uno de ellos).

(Esta es en realidad una pregunta de entrevista de la que se dice que elimina a un porcentaje significativo de programadores candidatos. Así que si lo resolviste, puedes sentirte bien contigo mismo.)

// Tu código aquí:

Tablero de Ajedrez

Escribe un programa que cree un cadena de texto que represente una cuadrícula de 8x8, usando el salto de línea como separador. En cada posición de la cuadrícula está o un espacio o un carácter "#". Los caracteres deberían formar un tablero de ajedrez.

Pasar esta cadena a console.log debería mostrar algo como esto:

 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #

Cuando tengas un programa que genere este patrón, defina una variable tamano = 8 y cambia el programa de tal manera que trabaje para cualquier tamano, produciendo una cuadrícula del ancho y alto dado.

// Tu código aquí: