JS Function Call 🎯

beginner
21 min

JS Function Call 🎯

Welcome to the exciting world of JavaScript (JS) Functions! In this lesson, we'll dive deep into understanding what function calls are and how they work. By the end of this tutorial, you'll have a solid foundation to create your own functions and build powerful JavaScript applications. 📝

What is a Function Call? 💡

A function call is the action of invoking or executing a JavaScript function. Functions are pieces of reusable code that perform specific tasks and can be called whenever needed within your code.

Let's start with a simple example to illustrate this concept:

javascript
// Define a function called greet function greet(name) { console.log("Hello, " + name + "!"); } // Call the function greet with the argument "John" greet("John");

In the above example, we define a function called greet that takes an argument called name. We then call the greet function with the argument "John", which executes the code inside the function and prints "Hello, John!" in the console. 💡

Understanding Function Call Syntax 📝

A function call consists of the function name followed by parentheses () that may contain arguments to be passed to the function. For example:

javascript
function greet(name) { console.log("Hello, " + name + "!"); } greet("John"); // Function call

Arguments and Parameters 💡

Parameters are the variables defined within a function that receive values when the function is called. The values passed to a function are called arguments.

Here's an updated example that demonstrates passing arguments to a function:

javascript
function greet(firstName, lastName) { console.log("Hello, " + firstName + " " + lastName + "!"); } greet("John", "Doe"); // Function call with arguments

In this example, we define a function called greet that takes two parameters: firstName and lastName. When we call the greet function, we pass in the values "John" and "Doe", which are assigned to the parameters within the function.

Return Values 📝

In addition to performing actions, functions can also return values. These returned values can be assigned to variables or used in other expressions.

Here's an example that demonstrates returning a value from a function:

javascript
function calculateArea(width, height) { const area = width * height; return area; } const area = calculateArea(4, 5); // Function call with arguments console.log(area); // Output: 20

In this example, we define a function called calculateArea that takes two parameters: width and height. It calculates the area of a rectangle and returns the value. We then assign the returned value to a variable called area and log it to the console.

Function Call Examples 💡

Now, let's explore some practical examples of function calls in real-world scenarios.

Example 1: Calculating the Average

javascript
function calculateAverage(num1, num2, num3) { const average = (num1 + num2 + num3) / 3; return average; } const avg = calculateAverage(5, 10, 15); console.log(avg); // Output: 10

In this example, we define a function called calculateAverage that takes three parameters and calculates the average of three numbers. We then call the function with the arguments 5, 10, and 15, and assign the returned value to a variable called avg.

Example 2: Validating User Input

javascript
function isValidEmail(email) { const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; return re.test(String(email).toLowerCase()); } const email = "john.doe@example.com"; console.log(isValidEmail(email)); // Output: true

In this example, we define a function called isValidEmail that takes an email address as an argument and checks if it's valid using a regular expression. We then call the function with the email address john.doe@example.com and log the result to the console.

Quiz Time 🎯

Quick Quiz
Question 1 of 1

What does a function call do?

Quick Quiz
Question 1 of 1

What are the differences between parameters and arguments in JavaScript functions?

Quick Quiz
Question 1 of 1

What does the following function do?