Scribd
Upload
4 views

Advanced Web Programming - Chapter 3

Uploaded by

2s5jjj8hvy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
4 views

Advanced Web Programming - Chapter 3

Uploaded by

2s5jjj8hvy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

Advanced Web Programming

Chapter 3: Functions
What is the Function?
To understand a function, lets discuss the following example:
As studied at school, distance is calculated by multiplying the speed by time.

In JavaScript this is written as follows:


var speed = 10;
var time = 5;
alert(speed * time);
We have two variables – speed and time – and each stores a number, the alert
function displays the result of multiplying the values stores by these two
variables.
The * character indicates the multiplication operation.
What is the Function?
Sometimes you need to repeat an operation more than one time with different
values, this problem can be solved using the function:
function showDistance(speed, time) {
alert(speed * time);
}
You can call the function for different values as follows:
• showDistance(10, 5);
• showDistance(85, 1.5);
• showDistance(12, 9);
• showDistance(42, 21);
Function Invocation
The code inside the function will execute when "something" invokes (calls) the
function:
• When an event occurs (when a user clicks a button)
• When it is invoked (called) from JavaScript code
• Automatically (self invoked)
A Simple Function
At a very basic level, a function is nothing more than a wrapper for some code.
A function basically
• Groups statements together
• Makes your code reusable
Each function requires a function call

In the example:
When the showDistance function gets called, the 10 corresponds to the speed argument, and the 5
corresponds to the distance argument. That mapping is entirely based on order.
A Simple Function
• Once the values you pass in as arguments reach your function, the names you specified for the arguments
are treated just like variable names
• The names of the arguments are treated as variable names.
• You can use these variable names to easily reference the values stored by the arguments inside your
function
Creating a Function That Takes
Arguments
• Once the values you pass in as arguments reach your function, the names you specified for the arguments
are treated just like variable names
• The names of the arguments are treated as variable names.
• You can use these variable names to easily reference the values stored by the arguments inside your
function
• You specify your arguments to the function as part of the function call:

function showDistance(speed, time) {


alert(speed * time);
}
showDistance(10, 5);
Creating a Function That Returns Data
Instead of having the function doing the display using alert we want to store the values for
other use. As follows:
var myDistance = showDistance(10, 5);
The Return Keyword:
The way you return data from a function is by using the return keyword.
In the following example, we calculate the distance, but instead of displaying an alert, we
return the distance
function getDistance(speed, time) {
var distance = speed * time;
return distance;
}
To call the getDistance function, you can just call it as part of initializing a variable:
var myDistance = showDistance(10, 5);
Exiting the Function Early
Once your function hits the return keyword, it stops everything it is doing at that point,
returns whatever value you specified to whatever called it, and exits:
function getDistance(speed, time) {
var distance = speed * time;
return distance;
if (speed < 0) {
distance *= -1;
}
}
Any code that exists after your return statement will not be reached, It will be as if that
chunk of code never even existed.
https://www.w3schools.com/js/js_functions.asp

You might also like