JavaScript Functions
Reusable Code Blocks
Functions are reusable code blocks designed to perform a particular task.
Functions are executed when they are called or invoked.
Functions are fundamental in all programming.
Why Use Functions?
Functions help you to:
- Reuse code (write once, run many times)
- Organize code into smaller parts
- Make code easier to read and maintain
What Does a Function Look Like?
A function can be created with the function keyword, a name, and parentheses.
The code to run is written inside curly brackets.
Example
A one liner:
function sayHello() { return "Hello World"; }
or more common:
function sayHello() {
return "Hello World";
}
Note
The function above does not do anything.
It has to be called first.
Functions Run When You Call Them
To run a function, you call it by using its name followed by parentheses like sayHello():
Note
Note that the value returned from the function can be stored in a variable.
JavaScript Function Syntax
function
name( p1, p2, ... ) {
// code to be executed
}
Functions are defined with the function keyword:
- followed by the function name
- followed by parentheses ( )
- followed by brackets { }
Optional parameters are listed inside parentheses: ( p1, p2, ... )
Code to be executed is listed inside curly brackets: { }
Functions can return an optional value back to the caller.
Example
Function to multiply two numbers:
function multiply(a, b) {
return a * b;
}
Try it Yourself »
Note
The function name follows the naming rules for variables.
A Function Can Be Used Many Times
A big benefit is that you can call the same function whenever you need it.
Example
function add(a, b) {
return a + b;
}
let sum1 = add(5, 5);
let sum2 = add(50, 50);
Try it Yourself »
Function Input and Output
The most useful functions work like this:
- Input - some parameters go in
- Function - some work is done
- Output - some value is returned
In the next three chapters, you will learn more about input and return values.
Common Mistakes
Forgetting to Call the Function
Writing sayHello does not run the function. You must write sayHello().Expecting Output
If a function does not return a value, storing it in a variable will give undefined.
Why Functions?
Functions enable better code organization and efficiency.
With functions you can reuse code.
You can write code that can be used many times.
The same code, with different input, can produce different results.
Next Chapter
Next: Calling JavaScript Functions
