HTML / JavaScript Reference
Functions, Arguments, Return
Example using arguments array
Public Domain
The examples on this page are released to the public domain. Read the Terms of Use for details. The contents of this page are still copyrighted.
Overview
Basic Rules <> Arguments and Return <> Flexible Arguments <> Changes to this Page
The overall purpose of functions is to organize the code into individual sections to increase readability and reusability. Instead of having all the code in one section, the logic is broken up based on certain functionality.
Basic Rules
Look at the following example. The statement num = incrementNumber(num); uses a function to assign a value to a variable. The function incrementNumber(numX) simply adds 5 to the number passed to it. This is a simple example, but putting it in its own function separates the code. This means you don't have to know the details of what function incrementNumber(numX) does. And the function can be called again later, which comes in useful when you need to use complicated logic over and over.
Basic Rules - example source
var num = 10;
num = incrementNumber(num);
function incrementNumber(numX)
{
return (numX + 5);
}
Arguments and Return
Two characteristics of functions are passing arguments and returning a value. When passing arguments, a value is sent to the function. Think of this as the way that one section of the code can share values with another part of the code. If the value is needed in the function, it either needs to be passed as an argument, or has to be put into a global variable. Global variables can be accessed anywhere in the code. Returning a value is used when sending back information to where it was called. For all practical purposes, you can pass as many arguments in that you want. But, you can only return one value.
Refer to the previous example again. Look at the line num = incrementNumber(num); That statement passes one argument to the function and has one value returned. Look at the line function incrementNumber(numX). You'll see that it has one argument: numX. This is the name of the variable that will be used in the function, and it does not have to match the name of the variable being passed in. In fact, you don't have to pass variables into the function. You can just send a literal value like "some stuff", 11, or true. The calling statement passes the arguments by value, which means a copy is made. The actual argument passed in is not affected by statements within the function. The return value of incrementNumber(numX) is determined by the return statement. In this example, the function returns the result of the expression numX + 5.
Flexibility of Function Arguments
The purpose of this example is to show how a function is flexible with its arguments. The message displayed for each button briefly describes the result. The source for this example is below.
Buttons (1) and (2)
A function does not need to explicitly declare any arguments. The arguments passed in are stored in an internal array that can be accessed using name of function.arguments.
Button (1) causes noExplicitArgs() to be called with no arguments. Since no arguments are passed in, the arguments array has no elements.
Button (2) sends an argument to noExplicitArgs(). The array has one element, which is displayed after looping through the arguments.
Buttons (3) and (4)
If a function does explicitly declare arguments, it does not need to be called with any arguments passed in.
Button (3) makes a call to function hasArg(x), but does not pass in a value for x. One way to find if x has a value is to check its equality against the keyword null. Notice that the message output says x is undefined.
Button (4) passes a value into the x argument.
Flexibility of Functions - example source
HTML
JavaScript
Changes to this Page
23-July-2001:
There used to be an example that went into more detail about return values.
It showed a function with a return true at the end.
The explanation was misleading because it indicated the function
had no return value when it wasn't used.
The point it was trying to make was a return value does not have to
be read into a variable or otherwise used.