October 20th, 2012: Objects, Parts 1

The following is a summary of my notes and examples I used during the meeting.

The Objectives of Today’s meeting:

• Learning to Define Objects.
• Creating Objects
• Understanding Predefined JavaScript Objects

What is an object?

• An object is a way of modeling something real, even thought the object is and abstract entity .

Why Objects are useful?

• Objects are useful because they give you another way to organize things within a script.
• In JavaScript you access object properties through the use of the dot operator, which is just a dot or period.

Creating Objects:

Naming conventions. 

 

• They are essentially the same rules you follow for naming variables and functions.
• Object names are case sensitive.  Thus an object named car would be different from an object named Car, CAR or caR.
• Avoiding Reserved Words/Objects You cannot use a JavaScript reserved word

 There are two ways to create objects in JavaScript:

• Constructor function
• Object initializer

Constructor Function

• A constructor function allows you to build an object using the same basic syntax as a regular function
• The keyword this in JavaScript is used to represent the current object being used, or "This object" so to speak.
• Once you have the object's properties set with the constructor function you need to create what is called an instance of the object in order to use it.
• To create  an instance of an object, you use another JavaScript keyword: new.

Object Initializer

• An object initializer is a little bit shorter than a constructor function.  The following is the syntax of an object initializer:

object_name=(property:value)

• An object created with the initializer function is already an instance of the object so you can just use the properties without the need to create a new instance of the object.

Here is the example I used during the SIG for Constructor Functions and an Object Initializer

//Constructor Function

function coat(material,style,fastener) {
this.material=material;
this.style=style;
this.fastener=fastener;
}

var eli_manning = new coat("Wool","Overcoat","Buttons");

var michael_vick = new coat("Nylon","Windbreaker","Zipper");
var tony_romo = new coat("Denium","Jacket","buttons");
var robert_griffin = new coat("Canvas","Frock","hook-and-loop");

document.write("Eli Manning is wearing a "+eli_manning.material+" "+eli_manning.style+" with "+eli_manning.fastener+"<br/>");

document.write("Michael Vick is wearing a "+michael_vick.material+" "+michael_vick.style+" with "+michael_vick.fastener+"<br/>");
document.write("Tony Romo is wearing a "+tony_romo.material+" "+tony_romo.style+" with "+tony_romo.fastener+"<br/>");
document.write("Robert Griffin is wearing a "+robert_griffin.material+" "+robert_griffin.style+" with "+robert_griffin.fastener+"<br/>");

//Obect Initializer

andrew_schooler={material:"Nylon", style:"Frock",fastener:"hook-and-loop"};

andrew_schooler={material:tony_romo.material, style:robert_griffin.style,fastener:robert_griffin.fastener}

document.write("Andrew Schooler is wearing a "+andrew_schooler.material+" "+andrew_schooler.style+" with "+andrew_schooler.fastener+"<br/>");

Adding Methods

You can use a  function to call various tasks that you might want to execute with the properties of the objects. This is referred to as a adding a method.

function get_cost(){

var the_cost=50;
the_cost += (this.material == "Wool") ? 100 : 50;
the_cost += (this.style == "Frock") ?  150 : 25;
the_cost += (this.fastener == "Buttons") ? 35 : 10;
return the_cost;
}

//Constructor Function

function coat(material,style,fastener) {
this.material=material;
this.style=style;
this.fastener=fastener;
this.cost_coat=get_cost;
}

var eli_manning = new coat("Wool","Overcoat","Buttons");

var michael_vick = new coat("Nylon","Windbreaker","Zipper");
var tony_romo = new coat("Denium","Jacket","buttons");
var robert_griffin = new coat("Canvas","Frock","hook-and-loop");

document.write("Eli Manning is wearing a "+eli_manning.material+" "+eli_manning.style+" with "+eli_manning.fastener+"<br/>");

document.write("Michael Vick is wearing a "+michael_vick.material+" "+michael_vick.style+" with "+michael_vick.fastener+"<br/>");
document.write("Tony Romo is wearing a "+tony_romo.material+" "+tony_romo.style+" with "+tony_romo.fastener+"<br/>");
document.write("Robert Griffin is wearing a "+robert_griffin.material+" "+robert_griffin.style+" with "+robert_griffin.fastener+"<br/>");
// var eli_coat_cost= eli_manning.cost_coat();
document.write("<br/>");

document.write("Eli Manning's coat cost $"+eli_manning.cost_coat()+"<br/>");

document.write("Michael Vick's coat cost $"+michael_vick.cost_coat()+"<br/>");
document.write("Tony Romo's coat cost $"+tony_romo.cost_coat()+"<br/>");
document.write("Robert Griffin's coat cost $"+robert_griffin.cost_coat()+"<br/>");

The Navigator Object / Predefined Object

The navigator object gives you access to various properties of the viewer's browser, such as its name, version number, and more.

navigator.property or method

Properties: appCodeName appName appVersion cookieEnabled onLine platform plugins userAgent

Methods:  javaEnabled() mozlsLocallyAvailable Preference() registerContentHandler() registerProtocolHandler() tainEnabled()

The History Object / Predefined Object

The history object, which is also part of the window object, provides information on the browser history of current window.

history.method

History.back

History.forward
History.go

For the example of the navigator object I created examples of each navigator property and put them into a js file.

document.write("The type of browser you are using is..."+navigator.appCodeName+"<br/>");

//The code name of the browser
document.write("The type of browser you are using is..."+navigator.appName+"<br/>");
//The name of the browser
document.write("The version of "+navigator.appName+" your using is "+navigator.appMinorVersion+"<br/>");
//A string representing the minor version of the browser (Internet Explorer only)
document.write("If that didn't work, it's because "+navigator.appName+" isn't Internet Explorer"+"<br/>");
document.write("What's the difference between "+navigator.appVersion+" and "+navigator.appMinorVersion+"<br/>");
//The version of the browser and some other information
document.write("This is the language I'm using...(IE and Opera) "+navigator.browserLanguage+"<br/>");
//The language of the broswer being used
document.write("This is the version of Firefox I'm using "+navigator.buildID+"<br/>");
//The build identifier of the browser being used
document.write("C is for Cookie "+navigator.cookieEnabled+"<br/>");
//Specifies whther or not the browser has cookes enabled
document.write("Your CPU is (IE ONLY) "+navigator.cpuClass+"<br/>");
//A string representing the class of the CPU
document.write("My browser is fluent in () "+navigator.language+"<br/>");
//The language of the browser being used
document.write("What MIMEs are supported "+navigator.mimeTypes+"<br/>");
//An array of MIME types supported by the browser
document.write("I'm connected? "+navigator.onLine+"<br/>");
//Specifies whether or not the browser is in "global offline mode"
document.write("My OS is (Firefox Only) "+navigator.oscpu+"<br/>");
//A string representing the product name of the browser being used
document.write("I'm creating this on a "+navigator.platform+"<br/>");
//The machine type for which the browser was created
document.write("I have the following plugins installed "+navigator.plugins+"<br/>");
//An array of the plugins the browser has installed on it
document.write("The browser I'm using (Firefox only) "+navigator.product+"<br/>");
//A string representing the product name of the browser being used
document.write("The build browser I'm using (Firefox only) "+navigator.productSub+"<br/>");
//The build number of the browser being used
document.write("???? (Firefox only) "+navigator.securityPolicy+"<br/>");
//An empty string-returned a value in Netscape 4.7
document.write("My default OS is using the following language(Internet Explorer only) "+navigator.systemLanguage+"<br/>");
//The default language used by the operating system
document.write("My natural OS is using the following language(Internet Explorer and Opera) "+navigator.userLangage+"<br/>");
//The natural language of the operating system
document.write("I'm using the following user agent "+navigator.userAgent+"<br/>");
//The user agent header for the browser
document.write("What is this? (Firefox only) "+navigator.vendor+"<br/>");
//An empty string-retruned a string representing the vendor of the browser being used
document.write("What is this? (Firefox only) "+navigator.vendor+"<br/>");
//An empty string-retruned the vendor version number of the browser being used

September 15th, 2012: Understanding Event Handlers

PACS JavaScript

The Objectives of Today’s SIG (September 15th, 2012) was :

• Learning Event Handlers
• Event Handlers in Script Code
• Using document.getElementById
• Other ways to register events
• The addEventListener () Method
• The attachEvent () Method

An event handler is a predefined JavaScript property of an object  (in most case and element in the document) that is used to handle an event on a Web Page.  It's a way of detecting user action and to have a definable reaction.  i.e. a useful way to add interactivity to your web page.  

The JavaScript events handler we discussed were:

Abort (onabort), Blur (onblur), Change (onchange), Click (onclick), ContextMenu (oncontextmenu), Copy (oncopy), Cut (oncut), Dblclick (ondblclick), Error (onerror), Focus (onfocus), Keydown (onkeydown), Keypress (onkeypress), Keyup (onkeyup), Load (onload), Mousedown (onmousedown), Mousemove (onmousemove), Mouseout (onmouseout), Mouseover (onmouseover), Mouseup (onmouseup), Paste (onpaste), Reset (onreset), Resize (onresize), Scroll (onscroll), Select (onselect), Submit (onsubmit), Unload (onunload)

To give a brief demonstration I created an Html document to that shows how the onclick event handler works.

"Example1.html"

<body>
<form>
<input type="button" value="Click Me!"
onclick="window.alert('Hi!');window.alert('Bye!');" />
</form>
</body>

I modified it so that I could play my dice roll game.

"Example1a.html"

<body>
<form>
<input type="button" value="Roll the Bones" onclick="diceroll();" />
</form>
<script type="text/javascript" src="js_event_01.js"></script>
</body>

For my third example the html document calls up a js file. 

"Example1b.html"

<body>
<form>
<input type="button" value="Roll the Bones" id="boneroll" />
<br/>
<input type="button" value="Gambling is evil" id="noroll" />
</form>
<script type="text/javascript" src="js_event_02.js"></script>
</body>

"js_event_02.js"

function diceroll() {
     var numb1=Math.floor(Math.random()*6+1);
     var numb2=Math.floor(Math.random()*6+1);
     window.alert("Roll 1 ="+numb1+" and Roll 2 ="+numb2);
     // window.alert(numb2);
    }
var rollbutton = document.getElementById("boneroll");
rollbutton.onclick=diceroll;

For my fourth example I created an html document that uses many of the different event handlers on one page.

"Example2.html"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/shtmll/DTD/shtmll-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>PACS JavaScript SIG</title>
</head>
<body onload="window.alert('I\'m done loading now!');">
<h1>PACS - JavaScript SIG / Examples of other Event Handlers</h1>
<br/>
<a href="http://none"
onclick="window.alert('Hey! You clicked me!'); return false;">
Don't Click Me</a>
<br/>
<a href="http://www.pagersource.com"
onmouseover="window.alert('I told you not to try and click me!');">
Don't try Clicking Me! </a>
<br/>
<a href="http://www.pageresource.com"
onmouseout="window.alert('What, you didn\'t like my link?');">
Click Me! </a>
<br/>
<form>
Enter your Name:
<input type="text" onfocus="window.alert('Don\'t forget to capitalize!');"/>
<br/>
Give this box focus:<br/>
<input type="text" onblur="window.alert('Hey! Come back!');" /><br/>
then give this box focus to blur the first one:<br/>
<input type="text" /><br/>
Are you cool?<br/>
<select onchange="window.alert('why did you change that?');">
<option selected="selected">yes</option>
<option>No</option>
</select>
<br/>
<input type="button" value="Do not Click Here"
onclick="window.alert('I told you not to click me!');">
<br/>
</form>
<Form onsubmit="window.alert('Thank you');">
What's you name?<br/>
<input type="text" id="thename" /><br/>
<input type="submit" value="Submit Form">
</form>
</body>

For the discussion of the document.getElementById I used the following example.

"Example3.html"

<script type="text/javascript">
function notEmpty(){

var myTextField = document.getElementById('myText');

if(myTextField.value != "")

alert("You entered: " + myTextField.value)

else

alert("Would you please enter some text?")       

}

</script>
<input type='text' id='myText' />
<input type='button' onclick='notEmpty()' value='Form Checker' />

May 19th, 2012: JavaScript Operators and Conditional Statements and Loops

Today's meeting (May 19th, 2012) we discussed two aspects of JavaScript;

• Operators
• The if/else statement

The following is a summary of my notes and examples I used for the meeting.

The Objectives of the SIG were the following:

·         Examine and discuss the different types of JavaScript Operators.

·         The four that we discussed were; Mathematical, Assignment, Comparison,& Logical

·         To better understand the Comparison and Logical Operators we also examined the If/else statement blocks

An operator is a symbol or word in JavaScript that performs some sort of calculation, comparison, or assignment on one or more values.

Conditional statements, such as if/else enable you to make use of the mathematical, comparison and logical operators because they enable you to specify in your code that an action should occur only when a condition is met.

JavaScript uses several different types of operators:

·         Mathematical = Preform mathematical calculations

·         Assignment = Assigns values to variables

·         Comparison =These operators are used to compare two values, two variables, or perhaps two longer statements.

·         Logical = These operators are used to compare two conditional statements

·         Bitwise = Logical operators that work at the bit level (Not discussed in SIG)

·         Special = These operators perform other special functions (Not discussed in SIG)

 The list of Mathematical Operators  

Addition	+	Adds two values
Subtraction	-	Subtracts one value from another
Multiplication	*	Multiplies two values
Division	/	Divides one value by another
Modulus	%	Divides one value by another and returns the remainder
Increment	++	Shortcut to add 1 to a single number
Decrement	--	Shortcut to subtract 1 from a single number
Unary negation	-	Makes a positive negative and vice versa

Here is the example I used during the SIG for Mathematical Operators 

<script type="text/javascript">

//document.write("When we use the operator + we get ");

function moe1(numb1, numb2) { //m.athematical o.perators e.xample 1

document.write("Our two numbers are "+numb1+" and "+numb2+"</br>");

var numbsum1=numb1+numb2;

document.write("When we use the \"\+\"\operator we get "+numbsum1+"</br>");

var numbsum=numb1+numb2;

document.write("When we use the \"\+\"\operator we get "+(numb1+numb2)+"</br>");

var numbdif=numb1-numb2; //I define the variable, but I don't use it, note the parentheses

document.write("When we use the \"\-\"\ operator we get "+(numb1-numb2)+"</br>");

document.write("When we use the \"\*\"\ operator we get "+(numb1*numb2)+"</br>");

document.write("When we use the \"\/\"\ operator we get "+(numb1/numb2)+"</br>");

document.write("When we use the \"\%\"\ operator we get "+(numb1%numb2)+"</br>");

document.write("When we use the Unary operator we get "+(-numbsum)+"</br>");

document.write("When we use the Unary operator we get "+(-numbdif)+"</br>");

var text1="base";

var text2="ball";

var textsum=text1+text2;

document.write("When we use the \"\+\"\operator we get "+textsum+"</br>");

/* if the left number is smaller than the right the Modulus returns the left number

The Increment Operator and Decrement operator will be discussed in the conditional loops

and statements sections

*/

}

moe1(4,5);

</script>

Assignment Operators assign values to variables. They do not compare two items, nor do they perform logical tests.

The list of Assignment Operators 

Assignment	=	Assigns the value on the right side of the operator to a variable.
Add and Assign	+=	Adds the value on the right side of the operator to the variable on the left side, and then assigns the new value to the variable
Subtract and assign	-=	Subtracts the value on the right side of the operator from the variable on the left side , and then assigns the new value to the variable
Multiply and assign	*=	Multiplies the value on the right side of the operator to the variable on the left side and then assigns the new value to the variable
Divide and assign	/=	Divides the value on the right side of the operator to the variable on the variable on the left side and then assigns the new value to the variable
Modulus and assign	%=	Takes the integer remainder of dividing the variable on the left side by the value on thright side, and assigns the new value to the variable

 Here is the example I used during the SIG for Assignment Operators

<script type="text/javascript">

function aoe1(numb1, numb2) { //a.ssignment o.perators e.xample 1

document.write("Our test numbers are "+numb1+" \(called numb1\) and "+numb2+" \(called numb2\)</br>");

document.write("Using the Assignment Operator \"\=\"\ we can assign the variable <strong>\"numbsum\"</strong> to equal the sum of the two numbers</br>");

var numbsum=numb1+numb2;

document.write("\(numb1\) "+numb1+" + \(numb2\) "+numb2+" = <strong>numbsum =</strong> "+numbsum+"</br>");

// the += Assignment Operators

var numbsum=numb1

document.write("</br>");

document.write("Or we can use the \"+=\"operator to change the value of one of the variables</br>");

var numb3=numb1;

numb3+=numb2

document.write("\(numb1\) += \(numb2\) = "+numb3+"</br>");

document.write("\(numb1\)= "+numb3+"</br>");

document.write("</br>");

// The -= Assignment Operators

var numbsum=numb1

document.write("Or we can use the \"-=\"operator to change the value of one of the variables</br>");

var numb3=numb1;

numb3-=numb2

document.write("\(numb1\) -= \(numb2\) = "+numb3+"</br>");

document.write("\(numb1\) = "+numb3+"</br>");

document.write("</br>");

// The Multiply and assign operator

var numbsum=numb1

document.write("Or we can use the \"*=\"operator to change the value of one of the variables</br>");

var numb3=numb1;

numb3*=numb2

document.write("\(numb1\) *= \(numb2\) = "+numb3+"</br>");

document.write("\(numb1\) = "+numb3+"</br>");

document.write("</br>");

// The Divide and assign operator

var numbsum=numb1

document.write("Or we can use the \"\=\"operator to change the value of one of the variables</br>");

var numb3=numb1;

numb3/=numb2

document.write("\(numb1\) /= \(numb2\) = "+numb3+"</br>");

document.write("\(numb1\) = "+numb3+"</br>");

document.write("</br>");

// The Modulus and assign operator

var numbsum=numb1

document.write("Or we can use the \"*=\"operator to change the value of one of the variables</br>");

var numb3=numb1;

numb3%=numb2

document.write("\(numb1\) %= \(numb2\) = "+numb3+"</br>");

document.write("\(numb1\) = "+numb3+"</br>");

document.write("</br>");

/* if the left number is smaller than the right the Modulus returns the left number

The Increment Operator and Decrement operator will be discussed in the conditional loops

and statements sections

*/

}

aoe1(24,15);

</script>

Comparison Operators are often used with conditional statements and loops in order to perform actions only when a certain condition is met. Since these operators compare two values, they return a value of either true or false, depending on the values on either side of the operator.

The list of Comparison Operators 

Is equal to	==	Returns true if the values on both sides of the operator are equal to each other
Is not equal to	!=	Returns true if the values on both sides of the operator are not equal to each other.
Is greater than	>	Returns true if the value on the left side of the operator is greater than the value on the right side.
Is less than	<	Returns true if the value on the left side of the operator is less than the value on the right side.
Is greater than or equal to	>=	Returns true if the value on the left side of the operator is greater than or equal to the value on the right side
Is less than or equal to	<=	Returns true if the value on the left side of the operator is less than or equal to the value on the right side
Strict is equal to	===	Returns true if the values on both sides are equal and of the same type
Strict is not equal to	!==	Returns true if the values on both sides are not equal or not of the same type

Here are the examples I used during the SIG for Comparison Operators.

The first example was a way for me to show two things; one, the Comparison Operators and two, the if/else statement blocks.

The following is the syntax for an if and if/else statement

 
If (condition) {

  //body of the of the if statement if the condition is met.

  //if condition fails then line after the closing bracket “}” is executed or the else statement is

  //executed.

}

else {

  //if the condition fails the body of the else statement (if else statement exist) is executed

} 

<script type="text/javascript">

/* Generate two random numbers, we use the number 6 in the line to simulate dice roll

As it is the number generated will be 0 thru 6, I use the +1 at the end to give me a

number between 1 and 6

*/

var numb1=3;

var numb2="3";

document.write("Number 1 ="+numb1+" and Number 2 ="+numb2+"</br>");

// Judge the two numbers to be equal using "is equal to" Comparison operator

//==, !=, >, <, >=, <=, ===, !==

if (numb1===numb2) {

  document.write("We have a match!  "+numb1+" equals "+numb2+"</br>"); 

  }

  else {

  document.write("No Match!</br>"); 

  }

  </script> 

During this example we tested if 3 was equal to “3” (the number 3 versus the text 3), and we also test this using the strict comparison operator (===).  The “Is equal to” comparison gave a true value return in the if/else statement block, but the “Strickt is equal to” returned a false value. 

In the next example I used the scenario of a creating a simple (virtual) dice game where I roll two dice and look for matches.  To accomplish this I use the following statement in my script. 

var numb1=Math.floor(Math.random()*6+1); 

This statement gives me a randomly generated number between 1 and 6.  I then use the following script to compare the two numbers and see if the two numbers match. 

<script type="text/javascript">

/* Generate two random numbers, we use the number 6 in the line to simulate dice roll

As it is the number generated will be 0 thru 6, I use the +1 at the end to give me a

number between 1 and 6

*/

var numb1=Math.floor(Math.random()*6+1);

var numb2=Math.floor(Math.random()*6+1);

document.write("<h1>Simple Dice Game</h1>")

document.write("Roll 1 ="+numb1+" and Roll 2 ="+numb2+"</br>");

// Judge the two numbers to be equal using "is equal to" Comparison operator

if (numb1==numb2) {

  document.write("We have a match!  "+numb1+" equals "+numb2+"</br>"); 

  }

  else {

  document.write("No Match!</br>"); 

  }

// Judge the two numbers to be equal using "is not equal to" Comparison operator

  if (numb1!=numb2) {

  document.write("Try again  "+numb1+" doesn't equal "+numb2+"</br>"); 

  }

  else {

  document.write("Success!</br>"); 

  }

// Judge which of the two numbers is the greater of the two Using the "Is greater than" Comp operator

  if (numb1>numb2) {

  document.write(+numb1+" is larger than "+numb2+"</br>"); 

  }

  else {

  document.write("</br>"); 

  }

// Judge which of the two numbers is the greater of the two Using the "Is less than" Comp operator

  if (numb1<numb2) {

  document.write(+numb1+" is smaller than "+numb2+"</br>"); 

  }

  else {

  document.write("</br>"); 

  }

  </script>  

The next script expands our dice game and uses the same statement to generate two random numbers between 1 and 6, but by using nested if/else statements we can compare the outcomes and simulate a game of craps.   

<script type="text/javascript">

  document.write("<h1>Example of Comparison Operators using If/Else</h1>");

  document.write("<h1>Nested If/Else Blocks</h1>");

</script>

</head>

<body>

<script type="text/javascript">

/* Generate two random numbers, we use the number 6 in the line to simulate dice roll

As it is the number generated will be 0 thru 6, I use the +1 at the end to give me a

number between 1 and 6

*/

var numb1=Math.floor(Math.random()*6+1);

var numb2=Math.floor(Math.random()*6+1);

document.write("<h1>Let's Roll The Bones</h1>")

document.write("Roll 1 ="+numb1+" and Roll 2 ="+numb2+"</br>");

// Judge the two numbers to be equal using "is equal to" Comparison operator

if (numb1==numb2){

            if (numb1==1){

                        document.write("SNAKE EYES");

            }

            else {

                        if (numb1==2){

                                    document.write("HARD FOUR");

                        }

                        else {

                                    if (numb1==3){

                                                document.write("HARD SIX");

                                    }

                                    else {

                                                if (numb1==4){

                                                            document.write("HARD EIGHTS");

                                                }

                                                else {

                                                            if (numb1==5){

                                                                        document.write("HARD TEN");

                                                            }

                                                            else {

                                                                        if(numb1==6){

                                                                                    document.write("BOXCARS");

                                                                        }

                                                                        else {

                                                                                    document.write("THAT'S IMPOSSIBLE");

                                                                        }

                                                            }

                                                }

                                    }

                        }

            }

}

else {

            numb3=(numb1+numb2);

            if (numb3==3){

                        document.write("ACE DEUCE");

            }

            else {

                        if (numb3==4){

                                    document.write("Easy Four");

                        }

                        else {

                                    if (numb3==5){

                                                document.write("FEVER FIVE");

                                    }

                                    else {

                                                if (numb3==6){

                                                            document.write("EASY SIX");

                                                }

                                                else {

                                                            if (numb3==7){

                                                                        document.write("NATURAL");

                                                            }

                                                            else {

                                                                        if (numb3==8){

                                                                                    document.write("EASY EIGHT");

                                                                        }

                                                                        else {

                                                                                    if (numb3==9){

                                                                                                document.write("NINA");

                                                                                    }

                                                                                    else {

                                                                                                if (numb3==10){

                                                                                                            document.write("EASY TEN");

                                                                                                }

                                                                                                else {

                                                                                                            if (numb3==11){

                                                                                                                        document.write("YO-LEVEN");

                                                                                                            }

                                                                                                            else {

                                                                                                                        document.write("WHAT ELSE IS THERE");

                                                                                                            }

                                                                                                }

                                                                                    }

                                                                        }

                                                            }

                                                }

                                    }

                        }

            }                   

}

  </script> 

Logical Operators allow you to compare two conditional statements to see if one or both of the statements returns a true value.  When a true value is return the rest of the conditional statement is executed. 

The list of Logical Operators 

AND	&&	Returns true if the statements on both sides of the operator are true.
OR	||	Returns true if a statement on either side of the operator is true.
NOT	!	Returns true if the statement ot the right side of the operator is not true.

 The following is the example I used to show how Logical Operators can be used in an if/else statement.   

<script type="text/javascript">

            //Testing more than one condition       

            var fname="Andrew";

            var lname="Schooler";

            var oname="Ron";           

            if ((fname=="Andrew")&&(lname=="Schooler")){

                        document.write("PACS JavaScript SIG leader is "+fname+" "+lname+"</br>");

            }

            if ((fname=="Ron")||(fname=="Andrew")){

                        document.write("Dear Mr. Schooler</br>");

            }

            if (!(fname==oname)){

                        document.write("435 Smith Rd., Lima, OH 45895</br>");

            }

</script>