JAVASCRIPT TUTORIAL - APPENDIX

Appendix - Overview

All the JavaScript statement used in this tutorial are listed here under the following headings:

Conditional - IF, ELSE and SWITCH
Looping - FOR, WHILE, DO WHILE, LABELED, BREAK, and CONTINUE
Object Manipulation and Operations - FOR...IN, NEW, THIS, and WITH
Comments - single-line (//) and multiline (/*...*/)

CONDITIONAL - IF, ELSE, SWITCH

The IF ... ELSE STATEMENT

The conditional statement, IF, is one that executes if a specific condition is true. You many also execute an additional statement if the conditional statement is false by using the ELSE. The format of the condition IF is:

if (condition) { statement(s) to be executed if condition is TRUE else { statement(s) to be executed if condition is FALSE } }

The condition can be any JavaScript statement that can be evaluated as either TRUE or FALSE. The statement(s) to be executed can be any Javascript statements including nested IF statements. If you want to use more than one statement after either an IF or ELSE then you must use curly brackets, { }, to enclose the statements. As a general rule, you should always use curly brackets with any IF..ELSE statements even if there is only one executable statement.

An example of the IF..ELSE statement is:

function checkEntry (x) { if (x == 3) { return true } else { alert("Enter only three characters. ") return false } }

The SWITCH STATEMENT

The conditional statement, SWITCH, evaluates an expression and attempts to match it with one of the case labels. If a match is found then the statement within the case is executed.

switch (expression){ case label : statement; break; case label : statement; break; ... default : statement; }

NOTE: If the JavaScript Reserve Word, break, which is optional is not present, then the code immediately following will be executed, i.e. the next case label. If the break is present, then the statement following the switch will be executed. A normal following statement is default:, which is the statement to be executed if none of the cases match the expression.

An example of the SWITCH is :

switch (color) { case "red" : alert ("You selected red.") break ; case "green" : alert ("You selected green.") break ; case "blue" : alert ("You selected blue.") break ; default : alert ("You didn't select red, green, or blue") }

LOOPING - FOR, WHILE, DO WHILE, CONTINUE, BREAK, LABELED

The FOR, WHILE, and DO WHILE Looping statements continue to execute until a specific condition is true.

The FOR STATEMENT

The WHILE STATEMENT

The WHILE statement is only executed if the conditional statement is true.

while (condition) { statement } an example is: var i = 15 ; while ( i >= 10 ) { document.write (" i = " + i ) ; i-- ; }

The DO WHILE STATEMENT

The DO WHILE executes the initial statement once before the conditional statement is checked and continues executing until the conditional statement is false.

do { statement } while (condition) an example is: var i = 1; do { document.write(" i = " + i); i++ ; } while (i < 10) ;

The CONTINUE STATEMENT

The continue statement can be used in a WHILE, FOR, and LABEL statement. In a WHILE or FOR loop the CONTINUE stops the current iteration and continues with the next iteration. In a WHILE loop, it jumps back to the condition statement. In a FOR loop, it jumps to the increment-expression statement.

In a LABEL statement, the CONTINUE must be followed the the label.

checkvariables : while (i<=5) { document.write(i + "<BR>"); i+=1; checkonj : while (j>=4) { document.write(j + "<BR>"); j-=1; if ((j%2)==0); continue checkonj; document.write(j + " is odd.<BR>"); } document.write("i = " + i + "<br>"); document.write("j = " + j + "<br>"); }

In the above I am using if ((j%2)==0); continue checkonj; to say, " if j equals zero, go back to checking on j".

The BREAK STATEMENT

In a WHILE or FOR statement, BREAK terminates the current loop and transfers control to the statement following the terminated loop. In a label statement, the BREAK causes the label statement to terminate and the statement after the label statement is executed.

checkvariables : if (i == 5) { alert("You've entered " + i + "."); checkonj : if (j == 2) { alert("You've entered " + j + "."); break checkonj; alert("The sum is " + (i+j) + "."); } alert(i + "-" + j + "=" + (i-j) + "."); }

OBJECT MANIPULATION - FOR...IN, NEW, THIS, WITH

Objects can be manipulated in several ways.

NEW

Use the NEW operator to create a new instance of a user defined objects or a built-in objects such as: Array, Boolean, Date, Function, Image, Number, Object, Option, RegExp, or String. The format for using new is:

name_of_object = new objectType ( param1 [,param2] ...[,paramN] ) example using built-in Date function: Today = new Date() example using a user defined object: function car (name, year, saleprice) { this.name = name this.year = year this.price = saleprice } carforsale = new car("Camry", 1993, 13500)

THIS

The THIS operator to refer to the current object. Normally, it will refer to the calling object in a method. The format is:

this.propertyname example: <script language="javascript">  </script> <form name="getage"> Enter a number: <INPUT TYPE = "text" NAME = "age" SIZE = 3 onChange="validate(this, 18, 99)"> </form>

FOR...IN

The for...in statement iterates a specified variable over all the properties of an object. For each distinct property, JavaScript executes the specified statements. A for...in statement looks as follows:

for (variable in object) { statements } example: function dump_props(obj, obj_name) { var result = "" for (var i in obj) { result += obj_name + "." + i + " = " + obj[i] + "<BR>" } result += "<p><img src="bar.gif">" return result } For an object car with properties make and model, result would be: car.make = Ford car.model = Mustang

WITH

The with statement establishes the default object for a set of statements. Within the set of statements, any property references that do not specify an object are assumed to be for the default object. A with statement looks as follows:

with (object){ statements } example: var a, x, y var r=10 with (Math) { a = PI * r * r x = r * cos(PI) y = r * sin(PI/2) }

COMMENTS - //, /*.....*/

Comments are a way for you to note within your JavaScript what you are trying to accomplish. Example of this are:

Single Line Comment - // this is a single line comment. Start each line with //. Multiple Line Comments - /* Generally we use this to incorporate * more than one line of comments * in the code. Note the use of the '*' * at the beginning of each line. * This helps to make the comment * stand out. */