Parte 4. Salida a pantalla en Javascript. ¡Registra, bosque, registra! Y qué es la consola.

Ahora que entendemos cómo es una llamada a función, nos resulta más fácil ver un patrón similar en el código para Javascript:

console.log(...);

Aquí vemos una llamada a la función log (no print como en Python, o printf como en C), a la que se le pasa el texto para mostrar.

Pero podrías tener tres preguntas:

  1. ¿Qué significa log?

  2. ¿Qué es console?

  3. ¿Y por qué delante de la función log pone console. (con un punto)?

Vamos a aclararlo todo paso a paso.

¡Registra, bosque, registra!

Consultemos un diccionario inglés-español y veamos el significado de la palabra log. Como siempre pasa en inglés, una sola palabra tiene un montón de significados: hay sustantivos, verbos y adjetivos.

Una vez hablamos de que:

el nombre de una variable debe reflejar la esencia de lo que almacena: la nomenclatura (naming) es una de las tareas más difíciles en programación: qué nombre ponerle a una variable para que su propósito sea inmediatamente claro

Lo mismo se aplica a las funciones. Una función es esencialmente un comando, una instrucción, en pocas palabras, una acción. Por lo tanto, en programación se acostumbra a nombrar siempre las funciones con un verbo o comenzar su nombre con un verbo, por ejemplo:

  • print (imprimir);

  • getUserInfo (obtener información del usuario);

  • setCurrentDate (establecer la fecha actual);

  • isResponseValid (¿es válida la respuesta? — en inglés “is” significa “ser/estar”, y en una pregunta el verbo va primero, así que literalmente el nombre de la función suena como “¿es la respuesta válida?”).

Por lo tanto, volviendo a la palabra log, podemos descartar “tronco”, “leño”, “registro” como sustantivo, y quedarnos con “registrar”, “anotar en un registro”.

En la jerga de los programadores, a menudo se dice “loguear”.

Recuerda que cuando hablamos de por qué todo comienza con el ejemplo “¡Hola, Mundo!”, dijimos que es muy importante aprender primero a ver qué está haciendo el programa durante su funcionamiento. Para ello, el programa debe poder enviar mensajes sobre su actividad actual, ya sea a la pantalla o a un archivo especial.

Si un programa escribe todos sus eventos en un archivo, ese archivo se llama archivo de registro (log file) o bitácora de eventos.

Console

Hubo un tiempo en que las computadoras ocupaban habitaciones enteras, y el operador tenía un dispositivo especial: una consola (panel de control) con una pantalla y un teclado, a través de la cual se “comunicaba” con la computadora.

La consola moderna en un navegador o en un IDE (Entorno de Desarrollo Integrado) es su descendiente digital, que:

  • proporciona una ventana virtual para “comunicarse” con el programa;

  • es el lugar donde el programa deja sus “notas” (logs);

  • permite ver qué “piensa” el programa o cómo funciona.

Y la función console.log envía sus mensajes exactamente allí.

Para encontrar la consola en tu navegador:

  1. Presiona F12 en el navegador.

  2. Encuentra la pestaña Console y cámbiate a ella.

  3. ¡Ahí está, nuestra consola!

  4. Ahora puedes escribir console.log("¡Hola, Mundo!"); después del símbolo > y ver inmediatamente el resultado: la cadena "¡Hola, Mundo!".

Consola en el Navegador Console.log Hola mundo en el navegador

Pero como por ahora estamos trabajando en una zona de pruebas (sandbox), todos los mensajes resultantes de la ejecución de console.log aparecerán en la ventana Output (Salida):

Console.log en zona de pruebas

Sobre el punto después de console

Y nos queda una última pregunta: ¿por qué la función se llama console.log, y no, por ejemplo, logToConsole (registrar en la consola)? ¿O simplemente log?

Una respuesta realmente completa toca un tema enorme: POO — Programación Orientada a Objetos. Pero por ahora no profundizaremos tanto y nos limitaremos a una explicación más simple.

Imagina que quieres enviar a la consola no solo mensajes normales, sino también advertencias y además errores. Entonces tendrías las funciones: warnToConsole (advertir en la consola) y errorToConsole (enviar error a la consola).

Como puedes ver, en las tres funciones se repetiría el mismo patrón: ToConsole, porque todas estas funciones estarían relacionadas con la consola:

  • logToConsole

  • warnToConsole

  • errorToConsole

Los creadores de Javascript decidieron: por qué no introducir un objeto console, que tendría sus propias funciones log, warn y error. Y se llamarían mediante un punto: console.log, etc.

Bueno, hablaremos de esto con más detalle cuando empecemos a explorar la POO.