Computer Basic Training

Computer Fundamentals

Dos-Disk Operating System

Windows - 98

Windows - Xp

Shortkeys

Computer Basic

Internet

Designing

HTML - hyper text transfer protocol

File Transfer Protocol

Computer Virus

Foxpro

Javascript

Career

Tools

Ecommerce

Computer Glossary

 


Javascript

Loops

for
The venerable for loop repeatedly cycles through a block of statements until a test condition is false. Typically, the number of times a loop is repeated depends on a counter. The JavaScript for syntax incorporates the counter and its increments:
for (initial-statement; test; increment) { statements; }

The initial-statement is executed first, and once only. Commonly, this statement is used to initialize a counter variable. Then the test is applied and if it succeeds then the statements are executed. The increment is applied to the counter variable and then the loop starts again. For instance, consider a loop which executes 10 times:
for (i=0; i<10; i++) { statements; }

do...while (Netscape & MSIE 4)
Another loop, a do—while statement executes a block of statements repeatedly until a condition becomes false. Due to its structure, this loop necessarily executes the statement at least once.

{ statements;} while (condition)

while
In similar fashion as the do...while statement, the while statement executes its statement block as long as the condition is true. The main difference between while and do—while, aside from the fact that only while is supported in all JavaScript versions, is that a while loop may not execute the statements even once if the condition is initially false.
while (condition) { statements; }

break and continue
Both of these statements may be used to "jump the tracks" of an iterating loop. When used within the statement block of a loop, each statement behaves slightly differently:
break : Aborts execution of the loop, drops out of loop to the next statement following the loop.
continue : Aborts this single iteration of the loop, returns execution to the loop control, meaning the condition specified by the loop statement. Loop may execute again if condition is still true.

Comments
Despite the fact that comments are purely optional, they can easily be a crucial part of your program. Comments can explain the action, like a color commentary, which can be a great help in understanding the code. Whether as a teaching tool or to simply remind yourself what the code does, comments are best sprinkled liberally throughout a program. Remember, comments are for humans, so write them that way!

Comments can also be used for debugging - you can comment "out" sections of code to prevent them from being executed. In doing so you may leam more about why a certain problem is occurring in your program.

Because JavaScript must ignore comments, there is an appropriate syntax for demarcating text as a comment. For single line comments, simply precede the line with two backslashes. For multi-line comment blocks, begin the comment with /* and close with */.
//A lonely ol' single line comment
/* A dense thicket of commentary, spanning many captivating lines
of explanation and intrigue. */

Functions
A function groups together a set of statements under a named subroutine. This allows you to conveniently "call" the function whenever its action is required. Functions are a fundamental building block of most JavaScript programs, so you'll become quite familiar with their use. Before you can call on a function, of course, you must first create it. We can break down the use of functions, then, into two logical categories: defining functions and calling functions.

Defining functions
The function definition is a statement which describes the function: its name, any values (known as "arguments") which it accepts incoming, and the statements of which the function is comprised.
function funcName(argumenti,argument2,etc) { statements; }

A function doesn't necessarily require arguments, in which case you need only write out the parenthesis;

e.g. funcNameQ. If you do specify arguments, those arguments will be variables within the function body (the statements which make up the function). The initial values of those variables will be any values passed on by the function call.

Generally it's best to define the functions for a page in the HEAD portion of a document. Since the HEAD is loaded first, this guarantees that functions are loaded before the user has a chance to do anything that might call a function. Alternately, some programmers place all of their functions into a separate file, and include them in a page using the SRC attribute of the SCRIPT tag. Either way, the key is to load the function definitions before any code is executed.

Calling functions
A function waits in the wings until it is called onto the stage. You call a function simply by specifying its name followed by a parenthetical list of arguments, if any:
clearPage();
boldblink("Call me gaudy!");
Functions which return a result should be called from within an expression:
total=raiseP(2,8) ;
if (raiseP(tax,2)<100) ...
Quite commonly, JavaScript functions are called from within event handlers, which we'll take a look at later in this article.

Objects
An object is a "package" of data; a collection of properties (variables) and methods (functions) all classed under a single name. For example, imagine that there was an object named car. We.could say that the car object possesses several properties: make, model, year, and color, for example. We might even say that car possesses some methods: go(), stop(), and reverse(). Although car is obviously fictional, you can see that its properties and methods all relate to a common theme.

In JavaScript you may create your own objects for storing data. More commonly, though, you will use the many "built-in" objects which allow you to work with, manipulate, and access the Web page and Web browser. This set of pre-existing objects is known as the "Document Object Model".

Document Object Model
Often referred to as the DOM, this object model is a hierarchy of all objects "built in" to JavaScript. Most of these objects are directly related to characteristics of the Web page or browser. The reason we qualify the term "built in" is because the DOM is technically separate from JavaScript itself. That is, the JavaScript language specification, standardized by the ECMA, does not actually specify the nature or specifics of the DOM. Consequently, Netscape and Microsoft have developed their own individual DOM's which are not entirely compatible. Additionally, the DOM stands apart from JavaScript because it could theoretically be accessed by other scripting languages as well.

In summary, then, what we refer to as "JavaScript" is actually made up of both JavaScript, the language, and the DOM, or object model which JavaScript can access. In a future WDVL article we will take a closer look at the DOM and its current and future role.
Below is a graphical chart illustrating a high-level view of Netscape's DOM. Microsoft's DOM is actually a superset of Netscape's, and so the chart below actually represents a subset of Microsoft's own DOM.

Error! Not a valid filename.
Reprinted from Netscape's JavaScript Guide

Properties
Access the properties of an object with a simple notation: objectName.propertyName. Both the object name and property name are case sensitive, so watch your typing. Because a property is essentially a variable, you can create new properties by simply assigning it a value. Assuming, for instance, that carObj already exists (we'll leam to create a new object shortly), you can give it properties named make, model, and year as follows:
carObj.make="Toyota";
carObj.model="Camry";
carObj.year=1990;
document.write(carObj.year);

A JavaScript object, basically, is an array. If you're familiar with other languages you probably recognize an array as a collection of values residing within a single named data structure. You can access an object's properties either using the objectName.propertyName syntax illustrated above, or by using an array syntax:
carObj["make"]="Toyota";
carObj["model"]="Camry";
document.write(carObj["year"]);

Methods
Unlike a basic data array, an object can also contain functions, which are known as methods when part of an object. You call a method using the basic syntax: objectName.methodNameQ. Any arguments required for the method are passed between the parentheses, just like a normal function call.
Vignesh Computer Education
For example, the window object possesses a method named closeQ, which simply closes the specified browser window:
window.close();

Creating Objects
Most of the time you will be referencing objects which are built-in to the DOM. However, you may want to create your own objects for storing data within a JavaScript program. There are several ways to create a new object, but we'll look at two: creating a direct instance of an object and creating an object prototype.
direct instance of an object
Despite the awkward sound name, a "direct instance of an object" simply means creating a new single object, such as myPetDog:
myPetDog=new Objectf);
myPetDog.name="Barney";
my Pet Dog.breed="beagle";
myPetDog.year=1981;
Assigning a method to your new object is also simple. Assume that you already have coded a function named woofO, which causes a barking sound to play:
myPetDog.woof=woof;

Prototype of an object
Sometimes, you'll want to create a "template" or prototype of an object. This does not create an actual instance of the object, but defines the structure of the object. In the future, then, you can quickly stamp out a particular instance of the object. Suppose that instead of myPetDog, you created a prototype object named petDog. This object could then be a template for a particular pet dog object. First, create a function which defines thepetDog structure:
function petDog(name, breed, year) { this.name = name;
this.breed = breed;
this.year = year;
Now that thepetDog prototype has been set, you can quickly create single instances of a new object based on thepetDog structure:
myPetDog=new pet Dog("barney","beagle",1981) ;
yourPetDog=new pet Dog("max","terrier",1990) ;

Event Handlers
JavaScript programs are typically event-driven. Events are actions that occur on the Web page, usually as a result of something the user does, although not always. For example, a button click is an event, as is giving focus to a form element; resizing the page is an event, as is submitting a form. It is these events which cause JavaScript programs to spring into action. For example, if you move your mouse over this phrase, a message will pop-up, courtesy of JavaScript.
An event, then, is the action which triggers an event handler. The event handler specifies which JavaScript code to execute. Often, event handlers are placed within the HTML tag which creates the object on which the event acts:
<tag attributel attribute2 onEventName="javascript code;">


The JavaScript which is called by the event handler may be any valid JavaScript code: a single statement or a series of statements, although most often it is a function call.

The set of all events which may occur, and the particular page elements on which they can occur, is part of the Document Object Model (DOM), and not JavaScript itself (see the earlier section "Document Object Model"). As a result, Netscape and Microsoft do not share the exact same set of events, nor are all page elements subject to the same events between browsers. For example, Internet Explorer 4 supports a MouseOver event for an image while Navigator 4 does not.

The table below illustrates some of the most commonly used events supported in both DOM's. Because the DOM's differ in their event support, the following documents are recommended as an overview of each browser's event support:
Common Events


Conclusion

Like an essay in English, a JavaScript program is a series of statements which work together towards a particular goal, and are made up of component grammatical elements, such as expressions and operators. Because JavaScript is a programming language invented "for the Web," it is oriented towards the specific needs of Web developers. The set of pre-built objects largely reflect characteristics of the Web page, allowing your JavaScript program to manipulate, modify, and react to the Web page.Interactivity is the driving force behind JavaScript, and so most JavaScript programs are launched by actions which occur on the Web page, often by the user. In doing so, JavaScript's purpose is to nudge Web pages away from static displays of data towards applications which can process and react.

Our Featured Links :


Copyright © 2006 Vignesh.in Computer Services. All rights reserved.