JAVASCRIPT CODING

Different methods of declaring JavaScript variables

---

// declaring one javascript variable var firstName; // declaring multiple javascript variables var firstName, lastName; // declaring and assigning one javascript variable var firstName = 'Homer'; // declaring and assigning multiple javascript variables var firstName = 'Homer', lastName = 'Simpson';

Using JavaScript variables

---

Although there are many uses for JavaScript variables, here is a quick and dirty

Example:

<*script language="javascript" type="text/javascript" > <*!-- hide me var firstName = prompt("What's your first name?", ""); // end hide --> <*!-- hide me document.write(firstName); // end hide --> <*/script> PLEASE Remove Firstly All Asterics *

Rules for JavaScript Variables

---

* Can contain any letter of the alphabet, digits 0-9, and the underscore character.
* No spaces
* No punctuation characters (eg comma, full stop, etc)
* The first character of a variable name cannot be a digit.
* JavaScript variables' names are case-sensitive. For example firstName and
FirstName are two different variables.

Writing a function in JavaScript

---

It's not that hard to write a function in JavaScript. Here's an example of a JavaScript function.

<*script type="text/javascript"> <*!-- function displayMessage(firstName) { alert("Hello " + firstName + ", hope you like JavaScript functions!") } //--> <*/script> Call the function: <*form> First name: <*input type="input" name="yourName" /> <*input type="button" onclick="displayMessage(form.yourName.value)" value="Display Message" /> <*/form> PLEASE Remove Firstly All Asterics *

Results:

Call the function: First name:

Example If statement:

---

<*script type="text/javascript"> <*!-- var myColor = "Blue"; if (myColor == "Blue") { document.write("Just like the sky!"); } //--> <*/script> PLEASE Remove Firstly All Asterics *

Results:

Just like the sky!

Example If Else statement:

---

<*script type="text/javascript"> <*!-- var myColor = "Red"; if (myColor == "Blue") {document.write("Just like the sky!");} else {document.write("Didn't pick blue huh?");} //--> <*/script> PLEASE Remove Firstly All Asterics *

Results:

Didn't pick blue huh?

Example If Else If statement:

---

<*script type="text/javascript"> <*!-- var myColor = "Red"; if (myColor == "Blue") {document.write("Just like the sky!");} else if (myColor = "Red") { document.write("Just like shiraz!");} else {document.write("Suit yourself then...");}//--> <*/script> PLEASE Remove Firstly All Asterics *

Results:

Just like shiraz!

Example For statement:

---

<*script type="text/javascript"> <*!--var myBankBalance = 0; for (myBankBalance = 0; myBankBalance <= 10; myBankBalance++) { document.write("My bank balance is $" + myBankBalance + "");}//--> <*/script> PLEASE Remove Firstly All Asterics *

Results:

My bank balance is $0 My bank balance is $1 My bank balance is $2 My bank balance is $3 My bank balance is $4 My bank balance is $5 My bank balance is $6 My bank balance is $7 My bank balance is $8 My bank balance is $9 My bank balance is $10

Example of void(0):

---

We have a link that should only do something (i.e. display a message) upon two clicks (i.e. a double click). If you click once, nothing should happen. We can specify the double click code by using JavaScript's "ondblclick" method. To prevent the page reloading upon a single click, we can use "JavaScript:void(0);" within the anchor link.

<*a href="JavaScript:void(0);" ondblclick="alert('Well done!')">Double Click Me!<*/a> PLEASE Remove Firstly All Asterics *

Results:

Double Click Me!

Same Example, but without void(0):

---

Look at what would happen if we didn't use "JavaScript:void(0);" within the anchor link...

<*a href="" ondblclick="alert('Well done!')">Double Click Me!<*/a> PLEASE Remove Firstly All Asterics *

Results:

Double Click Me!

Code with a Try... Catch statement:

---

<*script type="text/javascript"> <*!-- try { document.write("My bank balance is $" + myBankBalance); } catch(err) { document.write("Sorry, an error has occurred"); document.write("...but hey, don't let that stop you!"); } //--> <*/script> PLEASE Remove Firstly All Asterics *

Results:

Sorry, an error has occurred...but hey, don't let that stop you!

THANK YOU