JavaScript Function Returns
The return statement ends function execution and specifies a value to be returned to the caller. Understanding how return works is essential for writing effective functions — from simple value returns to advanced patterns like returning functions and objects.
The return Statement
When JavaScript reaches a return statement, the function stops executing and sends the specified value back to the caller. Any code after return in the same block is not executed.
function add(a, b) {
return a + b;
console.log("This never runs!");
}
let sum = add(5, 3);
console.log(sum);
// Using the return value directly
console.log(add(10, 20));
console.log(add(1, 2) * add(3, 4));Returning Different Types
A function can return any type: numbers, strings, booleans, arrays, objects, or even other functions. The return type is not fixed — the same function could return different types (though this is usually not recommended).
// Return a string
function getGreeting(name) {
return `Hello, ${name}!`;
}
console.log(getGreeting("Alice"));
// Return an array
function getMinMax(arr) {
return [Math.min(...arr), Math.max(...arr)];
}
let [min, max] = getMinMax([3, 1, 4, 1, 5, 9]);
console.log(`Min: ${min}, Max: ${max}`);
// Return a boolean
function isEven(n) {
return n % 2 === 0;
}
console.log(isEven(4));
console.log(isEven(7));Returning Objects
Functions frequently return objects. When returning an object literal in an arrow function, wrap it in parentheses to avoid confusion with a code block.
// Regular function returning an object
function createUser(name, age) {
return {
name: name,
age: age,
isAdult: age >= 18
};
}
let user = createUser("Alice", 25);
console.log(user);
console.log(user.name);
// Arrow function returning object (use parentheses!)
const makePoint = (x, y) => ({ x, y });
console.log(makePoint(10, 20));
// Without parentheses it would be a code block, not an objectReturning Functions
Functions can return other functions. This is the basis for closures, factory functions, and higher-order programming. The returned function retains access to the variables of the outer function.
function multiplier(factor) {
return function(number) {
return number * factor;
};
}
let double = multiplier(2);
let triple = multiplier(3);
console.log(double(5));
console.log(triple(5));
console.log(multiplier(10)(4));
// Practical: create greeting functions
function greeter(greeting) {
return function(name) {
return `${greeting}, ${name}!`;
};
}
let sayHello = greeter("Hello");
let sayHi = greeter("Hi");
console.log(sayHello("Alice"));
console.log(sayHi("Bob"));Void Functions and Early Return
If a function has no return statement (or uses return without a value), it returns undefined. The early return pattern uses return to exit a function as soon as a condition is met, reducing nesting and improving readability.
// Void function — no return value
function logMessage(msg) {
console.log(msg);
// implicitly returns undefined
}
let result = logMessage("Hello");
console.log(result);
// Empty return
function earlyExit(x) {
if (x < 0) return;
console.log("x is:", x);
}
earlyExit(-1);
earlyExit(5);
// Early return pattern (guard clauses)
function processAge(age) {
if (typeof age !== "number") return "Invalid input";
if (age < 0) return "Age cannot be negative";
if (age < 18) return "Minor";
return "Adult";
}
console.log(processAge("abc"));
console.log(processAge(-5));
console.log(processAge(15));
console.log(processAge(25));| Return Pattern | Example | Use Case |
|---|---|---|
| Single value | return 42; | Computations |
| Object | return { x, y }; | Structured data |
| Array | return [min, max]; | Multiple values |
| Function | return (n) => n * 2; | Closures, factories |
| No return | (no return statement) | Side effects only |
| Empty return | return; | Early exit |
| Guard clause | if (bad) return err; | Input validation |