Lección 4 de 13 · Lectura y práctica

La consola y los comentarios

Herramientas básicas: la consola y los comentarios Estas dos herramientas te acompañarán durante todo tu camino como programador. La consola te muestra qué está pasando en tu código, y los comentarios te ayudan a entenderlo más.

Del concepto a la práctica

Taller de esta lección

La consola sirve para observar una hipótesis, no para sustituir una prueba. Una inspección útil muestra el valor, su tipo y, cuando hay una colección, una representación ordenada. Los comentarios deben explicar la razón de una decisión, como por qué se rechaza una duración negativa, y no repetir literalmente el código.

Ejemplo resuelto

const registros = [
  { titulo: "Leer", minutos: 20 },
  { titulo: "Caminar", minutos: 15 }
];
console.table(registros);
console.log("Total:", registros[0].minutos + registros[1].minutos);
// Total: 35

Pruébalo

Cambia Caminar por Cocinar sin alterar los minutos.
Añade un tercer registro con 10 minutos.
Muestra el total de los tres registros.
Usa un comentario para explicar la unidad del total.

Error frecuente: dejar comentarios que anuncian un resultado antiguo. Corrige actualizándolos o eliminándolos cuando ya no ayudan a interpretar la prueba.

Comprueba tu resultado

Con los registros 20, 15 y 10, el total esperado es 45 minutos. La tabla debe contener tres filas y cada fila debe conservar título y minutos como propiedades separadas.

Diagrama de decisión con ramas Sí y No y un bucle que procesa cada elemento de una lista. — **Cómo avanza un programa**
Una condición decide qué camino ejecuta el programa. Un bucle repite una operación mientras queden elementos, y termina cuando la lista se agota. Separar ambas ideas ayuda a seguir el flujo y comprobar casos límite.
Ver la infografía en tamaño completo ↗

Herramientas básicas: la consola y los comentarios

Estas dos herramientas te acompañarán durante todo tu camino como programador. La consola te muestra qué está pasando en tu código, y los comentarios te ayudan a entenderlo más adelante. Dominarlas desde el principio te hará la vida mucho más fácil.

La consola del navegador

La consola es tu mejor aliada mientras aprendes. Te permite ver errores, imprimir valores para entender qué ocurre (a esto se le llama depurar o debugging) y ejecutar código al instante.

Métodos del objeto console

// Imprimir un mensaje informativo
console.log("Hola mundo");

// Imprimir una advertencia (aparece en amarillo)
console.warn("Cuidado: valor inesperado");

// Imprimir un error (aparece en rojo)
console.error("Algo salió mal");

// Mostrar datos en forma de tabla
console.table(["manzana", "banana", "naranja"]);

// Medir cuánto tarda un bloque de código
console.time("calculo");
// ... aquí va tu código ...
console.timeEnd("calculo");

// Limpiar la consola
console.clear();

Consejo

Puedes imprimir varios valores a la vez: console.log("Usuario:", nombre, "Edad:", edad). La consola los separa con espacios y respeta su tipo (los objetos se ven expandibles).

Comentarios en JavaScript

Los comentarios son notas que escribes en tu código para ti o para otras personas. JavaScript los ignora por completo al ejecutar.

Tipos de comentarios

// Comentario de una sola línea

/* Comentario
   de varias
   líneas */

/**
 * Comentario de documentación (JSDoc).
 * @param {string} nombre - El nombre a saludar.
 * @returns {string} El saludo completo.
 */
function saludar(nombre) {
  return "Hola " + nombre;
}

Buenas prácticas con comentarios

Explica el porqué, no el qué (el código ya dice qué hace).
Mantén los comentarios actualizados: un comentario falso es peor que ninguno.
No comentes lo obvio: i = i + 1; // suma uno sobra.

¿Qué método usarías para mostrar un mensaje de error en rojo en la consola?

console.error() muestra el mensaje resaltado en rojo, ideal para errores. console.warn() lo muestra en amarillo y console.log() es neutro.

Ejercicio práctico

Objetivo: practicar la consola y los comentarios.

En la consola del navegador, escribe un console.log, un console.warn y un console.error con mensajes distintos.
Usa console.table con una lista de tus 3 comidas favoritas.
En un archivo, escribe una función pequeña y documéntala con un comentario JSDoc que explique qué hace.

Entregable: el código de tu función comentada y una captura de la consola con los tres tipos de mensaje.

Para recordar

console.log, warn y error sirven para inspeccionar tu código.
console.table muestra listas y objetos de forma ordenada.
Los comentarios explican el porqué y deben mantenerse al día.

Sigue con JavaScript Fundamentals

Esta lección forma parte de un curso de Cursalo. Revisa su programa y elige entre la compra individual o el acceso a toda la escuela.

Ver curso y opciones de acceso Ya soy estudiante

Si ya tenías acceso a este curso, entra con tu cuenta: tus derechos y tu progreso se conservan. No necesitas comprarlo de nuevo.

← Anterior: Configurando tu entorno de desarrollo Siguiente: Quiz: Introduccion a JavaScript →Entrar y guardar mi progreso