Function Return Values

By the end of this lesson, you will be able to write JavaScript functions that send a result back to the caller using return, and use that result in variables, expressions, and other function calls.

What it is

A function return value is the result a function sends back to the code that called it. Think of a function as a small machine: you pass inputs, called arguments, into the function, and the function can give you one output. The return keyword is how JavaScript sends that output back.

Related terms include caller, the code that invokes the function; argument, the value passed in; parameter, the named variable inside the function; and return value, the result produced by return. If a function does not use return, it returns undefined by default.

Why it matters

• Return values let functions produce data instead of only performing actions.
• They make code reusable because the same function can be called in many places.
• They allow results to be stored in variables, such as const sum = add(2, 3);.
• They support composition, where one function uses the result of another.
• They help separate calculation from display, so a function can return a number while the caller decides whether to print it.

Syntax or steps

The smallest useful pattern is a function declaration with parameters and a return statement:

function add(a, b) {
  return a + b;
}

const sum = add(2, 3);

When add(2, 3) runs, JavaScript executes the function body. The return statement sends 5 back to the caller, and sum receives that value.

Example

function calculateTotal(price, quantity, taxRate) {
  const subtotal = price * quantity;
  const tax = subtotal * taxRate;
  return subtotal + tax;
}

const total = calculateTotal(10, 3, 0.08);
console.log(total); // 32.4

In this example, calculateTotal receives three arguments. It calculates a subtotal and tax, then returns the final amount. The caller stores the returned value in total. The console.log call is outside the function, so the function itself does not print anything; it only provides a result.

Common mistakes

• Forgetting return. If a function calculates a value but does not return it, the caller receives undefined. Fix: add return result;.
• Using console.log instead of return. Logging shows a value in the console, but it does not send the value back to the caller. Fix: return the value and let the caller log it if needed.
• Expecting multiple return values. A JavaScript function returns one value. Fix: return an array or object if you need to send several related results.
• Putting code after return. Code after return inside the same block will not run. Fix: move the return statement to the end, or remove unreachable code.

When to use it

Use a return value when the caller needs data from the function. Use side effects, such as printing or changing the DOM, when the purpose is to perform an action rather than produce a value.

Practice

Guided exercise: write a function named multiply that takes two numbers and returns their product. Then store the result in a variable and log it.

1. Declare function multiply(a, b).
2. Inside the function, return a * b.
3. Call it with const product = multiply(4, 5);.
4. Log product.

Expected output: 20.

Challenge: write getFullName(first, last) that returns a string like "Ada Lovelace". Hint: use return first + " " + last;.

Quick check

Question: What does const result = add(2, 3); do if add returns 5?

Answer: It calls add, receives the returned value 5, and stores that value in the variable result.

Summary

A return value is the result a function sends back to its caller. It lets JavaScript functions produce reusable data instead of only performing actions. Remember that return gives a value to the caller, while console.log only displays it.