Flash cards
Review the key moves
What is the main idea behind JavaScript Functions?
Lesson checks
Practice each idea before moving on
Short Mimo-style checks built from this lesson's code, terms, and sequence.
Which statement best captures the main point of this lesson?
Complete the missing token from the example code.
___ sayHello() { return "Hello World"; }Put the learning moves in the order that makes the concept easiest to apply.
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 .
A one liner
function sayHello() { return "Hello World"; }function sayHello() {
return "Hello World";
}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() :
Example
function sayHello() {
return "Hello World";
}
let message = sayHello();() means execute now.
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 { }
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
function multiply(a, b) {
return a * b;
}A function definition is not an executable statement.
It is not common to end a function definition with a semicolon.
Semicolons are used to separate executable JavaScript statements .
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);Note that values returned from functions can be stored in variables.
Local Variables
Variables declared within a JavaScript function, become LOCAL to the function.
Local variables can only be accessed from within the function.
Example
// 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.
Local variables are created when a function starts, and deleted when the function is completed.
Functions Used as Variables
Functions can be used as variables, in all types of formulas, assignments, and calculations.
Example
let x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";Why Functions?
Functions enable better code organization and efficiency.
With functions you can reuse the same code many times.
The same code, with different input, can produce different results .
Function Input and Output
The most useful functions work like this:
- Parameters - some values are sent to the function
- Arguments - some values are received by the function
- Function Code - some work is done inside the function
- Return Output - some value is returned from the function
In the next chapters, you will learn more about input and return values.
Calling JavaScript Functions
- Functions are executed when they are called or invoked
- You call a function by adding parentheses to its name like: name()