JavaScript Functions
Functions are reusable code blocks designed to perform a particular task.
Functions are 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 languages.
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
Example Code
javascriptfunction sayHello() { return "Hello World"; }Functions Run When You Call Them
To run a function, you call it by using its name followed by parentheses like sayHello():
Example
Example Code
javascriptfunction sayHello() {
return "Hello World";
}
let message = sayHello();JavaScript Function Syntax
Example
Example Code
javascriptfunction
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 { }
The function name follows the naming rules for variables.
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
Example Code
javascriptfunction multiply(a, b) {
return a * b;
}A Function Can Be Used Many Times
A big benefit is that you can call the same function whenever you need it.
Example
Example Code
javascriptfunction add(a, b) {
return a + b;
}
let sum1 = add(5, 5);
let sum2 = add(50, 50);Local Variables
Variables declared within a JavaScript function, become LOCAL to the function.
Local variables can only be accessed from within the function.
Example
Example Code
javascript// code here can NOT use carName
function myFunction() {
let carName = "Volvo";
// code here CAN use carName
}
// code here can NOT use carNameSince local variables are only recognized inside their functions, variables with the same name can be used in different functions.
Functions Used as Variables
Functions can be used as variables, in all types of formulas, assignments, and calculations.
Example
Example Code
javascriptlet x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";Function Input and Output
The most useful functions work like this:
- Parameters - The names listed in the function definition
- Arguments - The values sent to the function when it is called
- Function Code - The work done inside the function
- Return Output - The value returned from the function
Example
Example Code
javascriptfunction greet(name) {
return "Hello " + name;
}
greet("Riya");In the example above:
| Parameter | name |
|---|---|
| Argument | "Riya" |
| Function code | return "Hello " + name; |
| Return value | "Hello Riya" |
Interactive Code Examples
JS Example 1
javascriptfunction sayHello() { return "Hello World"; }JS Example 2
javascriptfunction sayHello() {
return "Hello World";
}
let message = sayHello();Example 3
javascriptfunction
name( p1, p2, ... ) {
// code to be executed
}JS Example 4
javascriptfunction multiply(a, b) {
return a * b;
}JS Example 5
javascriptfunction add(a, b) {
return a + b;
}
let sum1 = add(5, 5);
let sum2 = add(50, 50);JS Example 6
javascript// code here can NOT use carName
function myFunction() {
let carName = "Volvo";
// code here CAN use carName
}
// code here can NOT use carName