- Detecting Browser Plug-ins
- Around and Around with Loops
- Writing with Loops
- Using For/In Loops
- Using Do/While Loops
- Checking if Java Is Enabled
- Functions
- Using Multi-level Conditionals
- Working with Functions That Return Values
- Handling Errors
- Putting More than One Script on a Page
- Scrolling Status Bars
- Status Bar Messages
This chapter is from the book
This chapter is from the book
This chapter is from the book
Functions
Before you get into the next example, you need to learn about functions, which you'll use often when writing JavaScript. A function is a set of JavaScript statements that performs a task. Every function must be given a name, and can be invoked, or called, by other parts of the script.
Functions can be called as many times as needed during the running of the script. For example, let's say that you've gotten some information that a user typed into a form and you've saved it using JavaScript (there's more about this sort of thing in Chapter 8, "Form Handling"). If you need to use that information again and again, you could repeat the same code over and over in your script. But it's better to write that code once as a function, and then call the function whenever you need it.
A function consists of the word function followed by the function name. There are always parentheses after the function name, followed by an opening brace. The statements that make up the function go on the following lines, then the function is closed by another brace. Here's what a function looks like:
function saySomething() {
alert("Four score and seven years ago")
}
Notice that the line with alert is indented? That makes it easier to read your code. All of the statements between the first brace and the last one (and you probably noticed that those two lines are not indented) are part of the function.
Calling a function
It's common to use an event handler (see Chapter 1 for a refresher on event handlers if you need it) to call a function. If you wanted to call the saySomething function when the user clicked a button, you would use code like this:
<input type="button" value="Lincoln"onclick="saySomething()">
Passing information to a function
You'll often want to take some information and give it to a function to be processed. This is called passing the information. Using the previous function example, the function is changed like this (and in Script 3.7 ):
function saySomething(message) {
alert(message)
}
)
Script 3.7 You can call the same function again and again.
And the button code is also changed:
<input type="button" value="Lincoln"
In the function definition above, the variable message is a parameter of the function. When the function is called, the data 'Four score and seven years ago...' is passed into the message parameter. Function parameters can be just about any data you want to use, including text strings, numbers, or even other JavaScript objects. Like all variables, you should give the ones you use as function parameters names that remind you what the variable is being used for.
The nice part about using this kind of function is that you could have a bunch of buttons, and they could all call the same function, yet result in different alert messages, as seen in Figure 3.11 .
<input type="button" value="Lincoln"
)
Figure 3.11 Calling the function with each of the three buttons in the top window results in three different responses, as shown in the three dialog boxes.