1. Technology

Learn Javascript

Passing Parameters

Join the Discussion

Questions? Comments?

Related Terms

Argument Parameter

Introduction.

You have already seen how functions can be used to run the same group of statements from multiple places within your program. This works fine where the statements that you want to run and the variables that you want to access are the same in each case but often you will find that the code you want to run for different variables is exactly the same except for the variable (or variables) that we want the code to use.

We can solve this problem by defining special variables in our function called arguments that will stand in for the real variables when we define the function. We then tell the function which real variables to use in place of those arguments by passing the required variables as parameters.

Passing Parameters to a Function

We will begin by looking at how we need to modify our function definition to include arguments. Here's an example:

function writeSentence(argument1,argument2) {
document.write('The '+argument1+' is '+argument2+'.<br />');
}

The exact line of text that will be written out by the document.write statement in this function does not just depend on the values stored in particular variables at the time of running the function, it now also depends on which variables that we tell the function to substitute into the place of the arguments we defined in the function.

Arguments are contained within the parentheses that follow the function name when the function is defined. If there is more than one argument to de specified then we separate them with commas. The arguments are then used within the function just as if they were variables but they are not, they are just substitute names for the variables that we will tell the function to use when we actually run it.

The next thing we need to look at is how we can tell the function which variables to use. Here's an example of how this is done.

var a = 'table';
var b = 'chair';
var c = 'red';
var d = 'blue';
writeSentence(a,c);
writeSentence(b,c);
b = 'other ' + b;
writeSentence(b,d);

This example calls the function three times. Each time the function is called the variables to use in place of the specified arguments are passed as parameters by including them between the parentheses following the function name where it appears in the code. Where there are multiple parameters to be passed these are separated by commas.

In this example code the first call equates "argument1" to the "a" variable and "argument2" to the variable "c". This means that the document.write statement within the function will write "The table is red.<br />". The second call equates "argument1" to the "b" variable and "argument2" to the "c" ariable (the same as before) and so the function will write out "Tht chair is red.<'br />".

When the third call to the function is made the value of the "b" variable has been changed and it is this changed value that will be used. This call will write out "The other chair is blue.<br />".

As you can see from the example, the variables that the arguments are related back to may be the same as in another call or may refer to a different variable. When the same variable is used in multiple calls then it is the value that the variable has at the time of the call that gets used and not necessarily its initial value.

Passing Values as Parameters

You don't have to define a variable to pass as a parameter to a function. You can pass values directly provided that the function is only going to use the value and is not expected to be able to change it.

As the "a" variable always contains "table" in our example above, we don't need to define this variable if we are only going to use the value in our function call. We can instead pass the value as the parameter instead of a variable containing the value.

We do it like this:

writeSentence('table',b);

You can pass any combination of variables and values as parameters to a function that does not update the value passed to it.

Using What You Know

At this point we can simplify any of the prior scripts that we have written and converted to use a function by passing the changable value as a parameter instead of defining a variable.

Here's one of our previous examples set up as a function using an argument:

function displayMessage(m) {
switch (m) {
case 1: document.write('Merry Christmas'); break;
case 2: document.write('Happy New Year'); break;
case 3: document.write('Happy Easter'); break;
case 4: document.write('Happy Holidays'); break;
default: document.write('Welcome');
}
}

Here is the statement you use to call that function:

displayMessage(0);

Past Lessons

  1. Introduction
  2. Decision Making

©2014 About.com. All rights reserved.