Return en JavaScript
En la lección anterior enviaste valores hacia dentro de una función. Los programas reales también suelen necesitar un valor de salida — un total, una etiqueta, sí/no — para que quien llama pueda seguir con el resultado. La palabra clave que envía ese resultado es return.
Qué hace return
Dentro del cuerpo escribes return expression;. JavaScript evalúa la expresión, entrega el valor a quien llama y termina esa llamada. Quien llama puede guardarlo: let total = add(3, 4); — aquí total pasa a ser 7.
return no es lo mismo que imprimir
📊 return frente a console.log
| Idea | Qué hace | Quién lo ve |
|---|---|---|
return value |
envía value a quien llama |
tu siguiente línea de código |
console.log(value) |
imprime value en la consola |
quien mira la consola |
| ambos | puedes imprimir y también devolver | el log es para ojos; return para el programa |
sin return |
la llamada termina con undefined |
guardar la llamada da undefined |
después de return |
se omiten las líneas posteriores de esa llamada | la salida temprana es intencional |
Imprimir ayuda a mirar. Devolver permite que el resto del programa use la respuesta. Los principiantes suelen solo imprimir dentro y se sorprenden de que let x = f() sea undefined — porque no se devolvió nada.
function add(a, b) {
return a + b;
}
let total = add(3, 4);
console.log(total);
Captura el resultado
add no imprime por sí sola. Devuelve 7. Quien llama lo guarda en total y luego imprime. Cambia los argumentos, mantén el cuerpo — la suma devuelta sigue a las entradas.
function greet(name) {
return "Hello, " + name;
}
let line = greet("Sara");
console.log(line);
Construye un valor para después
greet arma una cadena y la entrega. line guarda Hello, Sara. Puedes pasar line a la página, a otra función o a una prueba — return abre el reuso fuera del cuerpo.
function demo() {
console.log("first");
return 1;
console.log("second");
}
demo();
Nada después de return se ejecuta
Esta llamada imprime first y luego devuelve 1. La línea que imprimiría second nunca corre. No es un error — return termina la llamada al instante.
function label(score) {
if (score < 0) {
return "invalid";
}
return "ok";
}
console.log(label(-1));
console.log(label(10));
Sal antes cuando la respuesta ya está lista
Si score es negativo, la función devuelve "invalid" y omite el resto. Si no, "ok". Este return temprano mantiene el camino feliz corto y legible.
function shout(msg) {
console.log(msg);
}
let result = shout("hi");
console.log(result);
¿Olvidaste el return?
shout solo imprime. La llamada termina, pero con undefined. Guardarla pone undefined en result. Si necesitas un valor fuera, escribe un return explícito.
Pon el valor devuelto en la página
Construye el mensaje con return y escribe esa cadena en un párrafo. La función se centra en producir texto; el código de la página decide dónde aparece.
Muestra return en la página
Declara una función que devuelva una cadena de bienvenida, llámala y coloca el resultado en un párrafo.
<!DOCTYPE html>
<html>
<head>
<title>return — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
function welcome(guest) {
return "Hello, " + guest;
}
let box = document.getElementById("msg");
box.textContent = welcome("Omar");
</script>
</body>
</html>
La página muestra Hello, Omar. welcome devolvió la cadena; la línea siguiente la escribió en el párrafo. Cambia solo el argumento, actualiza y lee la nueva línea. Siguiente lección: funciones flecha — una forma más corta de escribir algunas de estas funciones.
Pruébalo tú
- Escribe
function sum(x, y)que devuelvax + y, guarda la llamada en una variable e imprímela. - Escribe
function hi(name)que devuelva"hi "másname, luego imprime la cadena devuelta. - Pon un
console.logdespués de unreturndentro de una función; confirma que esa línea no imprime. - Escribe un guardia: si
n === 0devuelve"zero", si no"nonzero". - Llama a una función que solo haga
console.logy guarda la llamada; confirmaundefined. - En el demo HTML cambia solo la cadena del argumento, actualiza y lee el párrafo.
Errores frecuentes
- Usar solo
console.logdentro y esperar quelet x = f()tenga un valor útil - Olvidar guardar o usar el valor devuelto en la llamada
- Escribir código después de
returny preguntarse por qué no corre - Escribir
return;vacío cuando queríasreturn value; - Buscar trucos de parámetros aquí — esta página es sobre salidas; las entradas fueron la lección anterior
Resumen
returnenvía un valor a quien llama- Guarda o usa ese valor fuera de la función
- Después de
return, se omite el resto de esa llamada - El return temprano es una salida limpia en casos especiales
- Sin
return(oreturnvacío) → la llamada daundefined - Las actualizaciones de página pueden usar una cadena devuelta
- Siguiente: funciones flecha — sintaxis compacta de función
🧠 Pon a Prueba tu Conocimiento
Pon a Prueba tu Conocimiento
Ponte a prueba con este cuestionario interactivo y descubre qué tan bien entiendes el tema
📝 Instrucciones
- Lee cada pregunta cuidadosamente
- Selecciona la mejor respuesta para cada pregunta
- Puedes repetir el quiz tantas veces como quieras
- Tu progreso se mostrará en la parte superior