return
Stops the function and gives a value back.
Platform under construction
Return Values
return sends a value back to the caller and stops the current function. Without return, a function gives back undefined.
function double(value) {
return value * 2;
}
const result = double(4);
Functions & Scope
A return value is the result a function gives back.
The return statement ends the function and provides a value to the caller. Code after return in the same branch does not run.
A function without return returns undefined. That is fine for functions that only perform a side effect, but calculation and formatting functions should usually return something useful.
Good return values make functions easy to test. If a function returns data, you can verify the result without needing the DOM or external state.
undefined
The default return value when no return is used.
Early return
Ends the function early for invalid or complete cases.
Pure result
A function can return a value without changing anything outside itself.
Examples
Functions become readable when input, output and scope are visible.
Return data from logic functions
function calculateProgress(done, total) {
if (total === 0) {
return 0;
}
return Math.round((done / total) * 100);
}
Expecting a return that does not exist
function calculateProgress(done, total) {
Math.round((done / total) * 100);
}
console.log(calculateProgress(4, 8)); // undefined
Code patterns
Reusable examples for quick reference.
These examples focus on syntax you will actually look up later: declarations, callbacks, returns, closures and context handling. Use the small patterns first, then study the deeper explanation.
Return a calculation
The caller receives the computed value.
function double(value) {
return value * 2;
}
console.log(double(5));
Return early
Guard invalid input before the main path.
function formatName(value) {
if (typeof value !== "string") {
return "Unknown";
}
return value.trim();
}
Return an object
Return structured results when one value is not enough.
function validateScore(score) {
return {
valid: score >= 0 && score <= 100,
score
};
}
Side effect function
Some functions intentionally return nothing useful.
function renderMessage(element, text) {
element.textContent = text;
}
const result = renderMessage(output, "Ready");
console.log(result); // undefined
Rules that matter
Keep behavior small, named and testable.
Functions are where JavaScript stops being a list of statements and becomes a system. Scope decides what each function can see, while return values and parameters decide how functions communicate.
Return from calculation functions
Callers need the result.
Use early returns for invalid cases
They keep the happy path less nested.
Separate data from side effects
A function that calculates should not also render if it does not need to.
Remember return stops execution
Code after return in the same branch does not run.
Return structured objects when useful
Objects can carry value, validity and message together.
Avoid implicit undefined surprises
If a result matters, return it explicitly.
Production thinking
Good functions reduce the amount of code you must hold in your head.
Why does this matter?
Return values are how functions communicate results. Without clear returns, code starts depending on hidden state.
Accessibility
Validation functions can return clear messages that UI code renders accessibly.
Production note
Production logic is easier to test when it returns values instead of modifying distant state.
SEO note
Content-generation functions should return predictable strings or objects before rendering them.
Live code lab
Change the HTML, CSS or JavaScript and run the result.
The preview runs inside an isolated iframe. The JavaScript is placed inside the HTML editor for now, so every example stays together and remains easy to understand.
Mini assignment
Try this now.
- Add a warning message for scores below 50.
- Return a severity property from validateScore.
- Remove one return statement and inspect the output.
Practice assignment
Do this before moving to the next topic.
- Write a function that returns a number.
- Write a function that returns early.
- Write a function that returns an object.
Try it yourself
Return a validation result
Self-check
Before you continue, prove that you understand Return Values.
Functions only become useful when you can explain what goes in, what comes out and which scope the function can see.
- Can you explain what return does?
- Can you explain why functions without return produce undefined?
- Can you explain early returns?
- Can you explain why returned values are testable?
- Can you explain when a function may intentionally return undefined?