LECCIÓN 48 / 60 · Código y herramientas reales

Encuentra un fallo usando un breakpoint

Al terminar, podrás: investigar una variable utilizando un breakpoint

Ruta esencialActividad guiada

Conviene conocer: Lección 22 · Devuelve un valor con return

La idea clave

Un breakpoint detiene temporalmente un programa para que puedas inspeccionar los valores en una línea. No consiste en añadir console.log: se usa el panel Sources o Depurador del navegador.

Ejemplo paso a paso

Este ejemplo muestra la idea en acción. Sigue los pasos y después cámbialo tú.

Archivos y comandos de ejemplo
function calcularTotal(precio, envio) {
  return precio + envio;
}
console.log(calcularTotal('12', 3));
  1. La función debería sumar 12 y 3, pero precio llega como texto.
  2. Al detenerse en return puedes inspeccionar que precio es "12" y envio es 3.
  3. La expresión devuelve "123" por concatenación; convertir precio a Number produce 15.

Practica con código

Antes de empezar, piensa: ¿Por qué aparece 123 y no 15?

Copia el ejemplo en un archivo o en la consola del navegador, coloca un breakpoint en return y comprueba los tipos antes de corregir.

El resultado que buscamos

El valor de precio es string; el de envio es number. Después de convertir, el resultado es 15.

Actividad con archivos reales

Necesitas un editor, las herramientas de desarrollo o una terminal: no simulamos esos resultados.

Descargar archivos del ejemplo ↓

Comprueba tu trabajo paso a paso

Esta actividad utiliza herramientas reales. No tiene corrección automática: solo tú puedes confirmar que has realizado cada paso.

Pasos para revisar

Marca todos los pasos después de realizarlos.

Necesito una pista

Busca Sources/Depurador en las herramientas del navegador y marca la línea de return.

Una pista más

Inspecciona typeof precio; después usa Number(precio) en la suma.

Ver solución y explicación

Sustituye return precio + envio por return Number(precio) + envio.

Qué debes recordar: Un breakpoint deja inspeccionar valores antes de corregir un fallo.

Actividad guiada: pendiente de autoevaluación

La lectura, las prácticas corregidas y las autoevaluaciones guiadas se guardan por separado en este navegador.

Revisado editorialmente · Referencia técnica específica ↗