Invoking or calling a function

When you use a function, you are calling the function. Calling a function is also known as invoking a function. A function call is also known as a function invocation. Invocation and Call can be used interchangeably to describe the same behavior.

When you finish this reading, you should be able to:

Function invocation

Now that you've written a function how do you actually use it? Once defined a function can be invoked or called as many times as you please.

When you invoke or call a function, you specify the data for a function to use. When you specify what data to use for a function call, you refer to that process as passing arguments to the function.

// Run the "node" command in the terminal
// Then paste the following code in the terminal
function averageMinus5(num1, num2) {
  return (num1 + num2) / 2 - 5;
}

// This function call passes the arguments 10 and 16.
averageMinus5(10, 16); // evaluates to 8
// This function call passes the arguments 7 and 3
averageMinus5(7, 3);   // evaluates to 0

When you call the function averageMinus5(10, 16), you run the code inside the definition for averageMinus5. That is, you plug in the parameters with real numbers (num1 becomes 10 and num2 becomes 16). Think of num1 and num2 as variables that contain the values you pass in when you called the function. Then you proceed by running the code inside the function. The parameter names num1 and num2 are used throughout the body of the function and behave like variables.

Returning a value

Now that you know how functions are declared and invoked let's talk about the inside of the function. Consider this statement: Every function in JavaScript returns undefined unless otherwise specified.

Now what does that mean? Let's start by refactoring the averageMinus5 function to not use the return keyword:

function averageMinus5(num1, num2) {
  (num1 + num2) / 2 - 5; // return keyword removed from code to run
}

averageMinus5(10, 16); // evaluates to undefined
averageMinus5(7, 3);   // evaluates to undefined

So what happened there? Let's do a quick step by step:

  1. You declared the averageMinus5 function
  2. averageMinus5 was called handing in the argument of 10 and 16
  3. The expression (10 + 6) / 2 - 5 was evaluated to the value of 8
  4. Then the function ends without encountering a return statement. Since nothing was specifically returned then the function returned the default value for a function which is undefined.

Now, compare this to when the return keyword was there in the function code block:

function averageMinus5(num1, num2) {
  return (num1 + num2) / 2 - 5;
}

averageMinus5(10, 16); // evaluates to 8
averageMinus5(7, 3);   // evaluates to 0

Let's break down the code:

  1. You declared the averageMinus5 function
  2. averageMinus5 was called handing in the argument of 10 and 16
  3. The expression (10 + 6) / 2 - 5 was evaluated to the value of 8
  4. Then the function ends by returning the expression's value of 8

When you call or invoke a function, the code jumps to the function definition and run the function code block with the called arguments or inputs. When the function code block hits a return statement, the function code block immediately exits the function, and jumps back to where you called the function, and evaluate the function call to the value it returned.

Every function call evaluates to its return value! In other words, the expression averageMinus5(10, 16) evaluates to 8 just like how the expression 1 + 1 evaluates to 2.

Another important rule of the return statement is that it stops function execution immediately. This means that any code after a return will not be executed!

function averageMinus5(num1, num2) {
  let sum = num1 + num2;
  return sum;
  // Anything under the `return sum` statement will NOT be executed.
  console.log("This will not be printed to the terminal.");
  return (num1 + num2) / 2 - 5;
}

averageMinus5(10, 16); // evaluates to 26
averageMinus5(7, 3);   // evaluates to 10

So the three things to remember about return statements are:

  1. Every function call evaluates to its return value.
  2. Every function in JavaScript returns undefined unless a return is specified.
  3. Once a return statement is encountered, the function will immediately stop and return the value, ignoring any code below the return statement.

What you learned

By writing a function you can reuse code over and over again to solve similar problems with different input data (arguments). This will make your life easier and allow you to start working on more complex problems.

This reading covered: