Platinum Edition Using HTML 4, XML, and Java 1.2
(Publisher: Macmillan Computer Publishing)
Author(s): Eric Ladd
ISBN: 078971759x
Publication Date: 11/01/98

The new Statement The new statement is the way that new objects are created in JavaScript. If, for example, you defined the following function to create a house object:

function house (rms,stl,yr,garp) { // define a house object
   this.room = rms;       // number of rooms (integer)
   this.style = stl;      // style (string)
   this.yearBuilt = yr;   // year built (integer)
   this.hasGarage = garp; // has garage? (boolean)
}

Example

You could then create an instance of a house object by using the new statement, as in the following:

var myhouse = new house(3,“Tenement”,1962,false);

A few notes about this example. First, note that the function used to create the object doesn’t actually return a value. The reason that this method can work is that the function makes use of the this object, which always refers to the current object. Second, although the function defines how to create the house object, none is actually created until the function is called using the new statement.

The return Statement The return statement specifies the value to be returned by a function.

Syntax

return expression;

Example

The following simple function returns the square of its argument, x, where x is any number.

function square( x ) {
   return x * x;
} 

The this Statement You use this to access methods or properties of an object within the object’s methods. The this statement always refers to the current object.

Syntax

this.property

Example

If setSize is a method of the document object, this refers to the specific object whose setSize method is called:

function setSize(x,y) {
   this.horizSize = x;
   this.vertSize = y;
}

This method sets the size for an object when called as follows:

document.setSize(640,480); 

The var Statement The var statement declares a variable varname, optionally initializing it to have value. The variable name varname can be any JavaScript identifier, and value can be any legal expression (including literals).

Syntax

var varname [= value] [, var varname [= value] ] […, var varname [= value] ]

Example

This statement declares the variables num_hits and cust_no, and initializes their values to zero.

var num_hits = 0, var cust_no = 0;

The while Statement The while statement contains a condition and a block of statements. The while statement evaluates the condition; if condition is TRUE, it executes the statements in the loop body. It then re-evaluates condition and continues to execute the statement block as long as condition is TRUE. When condition evaluates to FALSE, execution continues with the next statement following the block.

Syntax

while (condition) {
   statements
}

Example

The following simple while loop iterates until it finds a form in the current document object whose name is “OrderForm” or until it runs out of forms in the document:

x = 0;
while ((x < document.forms[].length) && (document.forms[x].name != “OrderForm”)) {
   x++
} 

The with Statement The with statement establishes object as the default object for the statements in block. Any property references without an object are then assumed to be for object.

Syntax

with object {
   statements
}

Example

This statement uses with to apply the write() method and set the value of the bgColor property of the document object.

with document {
   write “Inside a with block, you don’t need to specify the object.”;
   bgColor = gray;
} 

JavaScript and Web Browsers

The most important thing you will be doing with your JavaScripts is interacting with the content and information on your Web pages, and through it, with your user. JavaScript interacts with your Web browser through the browser’s object model. Different aspects of the Web browser exist as different objects, with properties and methods that can be accessed by JavaScript. For instance, document.write() uses the write method of the document object. Understanding this Web Browser Object Model is crucial to using JavaScript effectively. Also, understanding how the Web browser processes and executes your scripts is also necessary.

When Scripts Execute

When you put JavaScript code in a page, the Web browser evaluates the code as soon as it is encountered. Functions, however, don’t get executed when they’re evaluated; they get stored for later use. You still have to call functions explicitly to make them work. Some functions are attached to objects—buttons or text fields on forms, for example, which are called when some event happens on the button or field. You might also have functions that you want to execute during page evaluation. You can do so by putting a call to the function at the appropriate place in the page.

Where to Put Your Scripts

You can put scripts anywhere within your HTML page, as long as they are surrounded with the <SCRIPT>…</SCRIPT> tags. One good system is to put functions that will be executed more than one time into the <HEAD> element of their pages; this element provides a convenient storage place. Because the <HEAD> element is at the beginning of the file, functions and VBScript code that you put there are evaluated before the rest of the document is loaded. Then you can execute the function at the appropriate point in your Web page by calling it, as in the following:

<SCRIPT language=”JavaScript”>
<!-- Hide this script from incompatible web browsers!
myFunction();
//   Hide this script from incompatible web browsers! -->
</SCRIPT>

Another way to execute scripts is to attach them to HTML elements that support scripts. When scripts are matched with events attached to these elements, the script is executed when the event occurs. This can be done with HTML elements, such as forms, buttons, or links. Consider Listing 18.2, which shows a simple example of two ways of attaching a JavaScript function to the onClick attribute of an HTML forms button (see Figure 18.2); it also shows how a JavaScript call can be executed in response to clicking a hypertext link.