EasyCode365EasyCode365

Functions

As your code grows, you will often need to do the same action more than once.

Instead of typing the same lines again and again, you can save those lines inside a function and reuse them later.

What a function is

A function is a named block of code that performs a specific task.

Think of it like writing down a recipe. Writing the recipe does not bake the cake. It only saves the steps.

In JavaScript, defining a function saves the code, but it does not run it. To run the code inside a function, you must call the function by its name.

Can edit
function add(a, b) {
    const result = a + b;
    return result;
}
console.log(add(3,4));
console.log(add(2,8));

Why functions are useful

Functions help you avoid repeating the same code.

They also make your code easier to read because a group of steps can have one clear name.

If you need to change what the function does, you can update it in one place instead of editing the same code many times.

First code example

Let's create and use a basic function.

Can edit
function showGreeting() {
  console.log("Welcome to learning JavaScript!");
}

showGreeting();

Code walkthrough

Let's break down what is happening:

  • function tells JavaScript that we are creating a function.
  • showGreeting is the function name.
  • The parentheses () come after the function name.
  • The curly braces {} hold the code we want to save.
  • console.log("Welcome to learning JavaScript!"); is the code inside the function.
  • showGreeting(); calls the function, so the saved code actually runs.

Without showGreeting();, the message would not appear in the Output section.

Calling a function more than once

You can call the same function as many times as you want.

Every time you call it, the code inside the function runs again.

Can edit
function cheer() {
  console.log("Hip, hip, hooray!");
}

cheer();
cheer();
cheer();

Mini task

Edit the cheer() code block above.

Change the message inside console.log() to something else, like "You did it!".

Then click Run to see your new message appear multiple times.

Short quiz

Question: What happens if you define a function but never call it?

  • A) The code runs automatically.
  • B) You get an error message.
  • C) The code inside the function does not run.

Answer: C. The code inside the function does not run.

Defining a function only saves the steps. You must call the function to run them.

Small challenge

Create a function named sayGoodbye.

Inside the function, use console.log() to print "See you later!".

Then call the function twice.

Can edit
// put your code below

console.log()

Summary

  • A function is a named block of code used to perform a specific task.
  • Functions help you reuse code without retyping it.
  • You create a function with the function keyword, a name, parentheses (), and curly braces {}.
  • Defining a function does not run the code inside it.
  • You must call the function by its name followed by parentheses to run it.