JavaScript return Statement
Understand how the JavaScript return statement works, why it is important,
and how to use it correctly with clear explanations and real-world examples.
The return statement in JavaScript is used to send a value
from a function back to the code that called it.
As soon as the return statement is executed,
the function immediately stops running.
Any code written after a return statement inside the same function
will never be executed. For this reason,
return is usually placed as the final statement
in a function.
A JavaScript function can return primitive values such as numbers, strings, or booleans, as well as reference values including arrays, objects, and even other functions.
Although JavaScript functions cannot return multiple values directly, developers commonly return multiple values using arrays or objects, which is a standard and widely accepted practice.
Syntax
return expression;
The expression is optional.
If no value is specified, the function automatically returns
undefined.
Line Terminator Issue with return
JavaScript does not allow a line break immediately after
the return keyword.
Due to automatic semicolon insertion (ASI),
the following code produces unexpected results:
return
x + y;
JavaScript interprets this code as:
return;
x + y; // This line is never executed
To avoid this issue, keep the returned expression on the same line or wrap it inside parentheses:
return (
x + y
);
Example: Returning a Value from a Function
JavaScript Example
function calculateTotal(price, taxRate) {
let tax = price * taxRate;
return price + tax;
}
let totalAmount = calculateTotal(100, 0.08);
console.log(totalAmount);
Try it Yourself »
Example 1: Using the return Statement
This example demonstrates how the return statement works in a JavaScript function. The function calculates the product of two numbers and returns the result to the calling code.
The function multiply() takes two parameters, multiplies them,
and sends the result back using the return keyword.
The returned value is stored in the variable result and then displayed in the console.
JavaScript Example
function multiply(a, b) {
return a * b;
}
let result = multiply(12, 30);
console.log(result);
Try it Yourself »
Example 2: Returning Multiple Values Using an Array
In this example, the function returns multiple related values by using an array. JavaScript’s ES6 array destructuring syntax is then used to extract each value into its own variable in a clean and readable way.
JavaScript Example
function getUserInfo() {
const firstName = 'John';
const lastName = 'Rickman';
const age = 25;
const occupation = 'Software Engineer';
return [firstName, lastName, age, occupation];
}
const [firstName, lastName, age, occupation] = getUserInfo();
console.log('Name:', firstName + ' ' + lastName);
console.log('Age:', age);
console.log('Occupation:', occupation);
Try it Yourself »
Example 4: Returning Multiple Values Using an Object
In this example, the function returns multiple related values wrapped inside an object. This approach is often preferred in real-world applications because object properties are named, making the returned data easier to understand and maintain.
JavaScript’s ES6 object destructuring syntax is then used to extract the returned values into individual variables.
JavaScript Example
function getEmployeeDetails() {
return {
firstName: 'John',
lastName: 'Rickman',
age: 25,
position: 'Software Engineer'
};
}
const { firstName, lastName, age, position } = getEmployeeDetails();
console.log('Name:', firstName + ' ' + lastName);
console.log('Age:', age);
console.log('Position:', position);
Try it Yourself »
Frequently Asked Questions
What does the return statement do in JavaScript?
The return statement sends a value from a function back to the code
that called it and immediately stops further execution of the function.
What happens if a function does not have a return statement?
If a function does not explicitly use return,
JavaScript automatically returns undefined.
Can a JavaScript function return multiple values?
JavaScript functions cannot return multiple values directly, but you can return an array or an object and then extract the values using destructuring.
Why is placing a line break after return problematic?
Due to JavaScript’s automatic semicolon insertion,
a line break after return causes the function to return
undefined, which often leads to unexpected behavior.
Does the return statement stop function execution?
Yes. Once a return statement is executed,
the function exits immediately and any remaining code is skipped.