VARIABLES AND ARGUMENTS
Variables
Variables are used to assign a name to any data type. These data values can be known or unknown, and can change at any time during execution of the script. In other words, the value can VARY, hense the term, "variable".
The keyword, "
var" precedes the variable name that you assign, and is used only once for declaration. Any future references to the variable are made without the var keyword. The variable can be assigned a value later on, or immediately by following the variable name with an equals sign, followed by a value. Assigning a value to a variable immediately is known as initializing the variable.
var myVarName //declare variable
myVarName = 162 //assign a value
OR
var myVarName = 162 //declare AND assign value, or "initialize"
In either case, the value of the variable can easily be changed later on:
myVarName = 202
Variable Names
Variable names cannot contain spaces, or begin with a number, and all punctuation symbols except for the underscore (_) are restricted.
Your variable names should be descriptive of the value they represent if for no other reason than script readability. Be careful to not use reserved keywords for your variable names. A common convention to help avoid using reserved words is using two (or more) word combinations. The two words can either be separated by an underscore (my_variable) or by capitalizing the second word (myVariable). While I prefer the latter, the convention you choose is up to you.
The example below is a small script that selects the text of a form's text input. Since the task requires two methods, it assigns a variable to the form element path so that only a reference to the variable is needed rather than a reference to the entire path for each method. Appending the variable with the form object methods, "focus()" and "select()" is as good as appending the entire path of the form element object with those methods.
function selectValue() {
var textValue = document.forms[0].elements[0]
textValue.focus()
textValue.select()
}
Variable Scope
The scope of a variable has to do with where in a document it is initialized. A variable initialized outside a function body is said to have a
global scope, while a variable initialized within a function body is said to have a
local scope. Global variables can be accessed by any other statement within the same document, while local variables can only be accessed by statements within their own function bodies.
Arguments
Arguments are a special kind of variable. They are used when you want to use multiple values for the same variable within a function. Since you can call a function from multiple locations, the values assigned can be completely different for each function call. Assigning values to arguments when a function is called is known as "passing arguments".
Three rules to remember about arguments:
- Declare the argument in the function's parentheses.
- Within the function, include the argument in the location it will be used.
- The value of the argument is defined when the function is called.
function passStuff(myArg) {
alert(myArg)
}
<a href="javascript:passStuff('One')">One</a>
<a href="javascript:passStuff('Two')">Two</a>
In the above example, the value of myArg is "
One" when the first call to the function is made. When the second call to the function is made, the value of myArg is "
Two".
Take a look at
this example using an argument with multiple values.
Multiple Arguments
Multiple arguments can be used within the same function, just separate the arguments with commas when they are declared.
function passStuff(myArg1,myArg2,myArg3) {
alert(myArg1 + myArg2 + myArg3)
}
<a href="javascript:passStuff('One','Two','Three')">One, Two, Three</a>
<a href="javascript:passStuff('Uno','Dos','Tres')">Uno, Dos, Tres</a>
One, Two, Three
Uno, Dos, Tres