The discussions in this section assume you are familiar with the fundamentals introduced in the overview. If not, please refer back as appropriate. This guide covers the following sections:
Like most coding languages, JavaScript is written in text format, and is organized into statements, blocks consisting of related statements, and comments.
A statement is basically an instruction to do an action, or an expression that evaluates to a value; a block is a sequence of related statements that perform a function or return a result. We use comments to note what our script does.
A JavaScript statement may consist of one or more instructions or expressions on a line. A new line begins a new statement, but it is a good idea to terminate each statement explicitly with a semicolon ( ; ), which is the JavaScript termination character.
A statement may be as simple as assigning a value. The equal sign ( = ) is used to indicate this action.
today = Date ( );
The statement above assigns the value of the current system date — the date that is set on a user's computer — to a variable named today. After the statement is declared, we can refer to the content of the variable in another statement by using its name, as in
document.write ( today );
The document is one of pre-defined generic objects specified in the DOM. The write that follows, separated by a period, is one of the object's pre-defined methods. The value inside of the parentheses is what the method will act upon, in this case, the content of our variable today.
So the script is basically saying: on the document object, write the content of the variable today.
Show me
In most cases, we need a sequence of statements to do a certain task; in some cases, we need to do the same task more than once. Instead of rewriting the same statements, we can define a function where we write the block of statements only once, and call the function whenever we need to perform the procedure.
In JavaScript, we use braces ( { } ) to specify the start and end of a block of compound statements. The following example shows how a function is typicaly defined.
function doWhatever ( )
{
statement1;
statement2;
}
The function statement explicitly declares that the following code is a procedure block. We identify each function we define by its name, which in this case is doWhatever. The pair of parenthesis ( ) after the function name is used to accept values, called parameters, that may be passed on to the function for certain purposes, as shall be explained later.
After a function is defined, we can call it by its name through another statement or, as in the following example, when an event occurs.
<body onLoad="doWhatever ( )">
The onLoad inside the BODY tag is called an event handler specifier. It does something that is assigned to it when the event happens, which in this case is to call our function doWhatever when the page has loaded.
Blocks are also used in conditionals to group statements that control a program's flow. The following example shows a function definition with a conditional statement that executes a block IF a situation is true, or ELSE calls another function if the condition evaluates to false.
function chkFirst ( )
{
if ( condition )
{
statement1;
statement2;
}
else
doWhatever ( );
}
Note also that here we have two pairs of braces: one for the whole function block, and one for the set of statements after the if statement. The statement after the else conditional does not have to be in braces because it is not a block; it just calls a function. You can write the braces however you like, but they must begin and end each block.
Conditional statements are explored in detail in Controlling Program Flow.
Like most coding languages, JavaScript allows us to write comments that explain what our script does. Comments are ignored by the interpreter, hence do not affect the operation of the script in any way. JavaScript supports two forms of comments.
A single-line JavaScript comment begins with a pair of forward slashes ( // ).
A multiline comment begins with a forward slash and an asterisk in combination ( /* ), and ends with the reverse ( */ ).
It is always a good idea to comment your code thoroughly. You never know when you'll have to figure out what it does.
// This is a single-line comment.
/*
This is a multiline comment that can be used to note
what a code statement does.
*/
A multiline comment may also be written as a series of single-line comments.
// This is a single-line comment.
// This is another single-line comment.