spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / programming / javascript / diaries / 5

[next]

Sr Software Engineer, Archiving
Professional Technical Resources
US-CA-Santa Clara

Justtechjobs.com Post A Job | Post A Resume
Developer News
Mandrake Linux Founder Back, Virtually
Amazon: We're a Technology Company
Sun Expands MySQL With Closed Source

The JavaScript Diaries: Part 5

  1. Introduction
  2. Data Types & Variables
  3. Operators
  4. Functions
  5. Conditional Statements and Loops
  6. Objects
  7. Browser-Based Objects
  8. Window Methods
  9. Window Event Handlers
  10. Navigator, Screen, History and Location Objects
  11. Arrays: Part 1 - Introduction
  12. Arrays: Part 2 - Multiple Array Types
  13. Arrays: Part 3 - Array Properties and Methods
  14. The Math Object
  15. The Date Object

By 

This week, as we continue our quest to learn the JavaScript language, we'll look at conditional statements and loops. These can help us to add more depth and complexity to our scripts.

Conditional Statements

A conditional statement is used to execute a portion of code, based on the outcome of whether a condition is met. We perform these types of operations all the time in our everyday lives. Here's an example: "If Bob wins the lottery, he will retire; otherwise he will continue working at his current job."

This conditional statement is actually pretty simple. The outcome of the problem depends upon one condition: whether Bob wins the lottery. The results are based on a true/false (Boolean) statement: if Bob wins the lottery (which we would consider "true"), then he will retire; if Bob doesn't win the lottery (which we would consider "false"), his current situation will not change so no action will be taken.

In JavaScript, conditional statements can be an effective aid in developing more complex scripts. These type of statements make use of the comparison operators we learned about in section 3. The result, as I said, is a Boolean value. We are testing to see if a value is true or false, not looking at the actual value of it, as such. There are several different types of conditional statements.

The if Statement

This conditional statement is written as:

  if (condition) {
    action to be taken
  }

This statement says that if the condition stated in the parentheses is true then execute the code given within the curly brackets. If the condition is false, the code within the curly brackets will be ignored and the script will continue executing the code located after the closing curly bracket. Let's take another look at our conditional statement above about Bob and the lottery. Here's what it would look like if we used a conditional statement:

  var winsLottery=true
  if (winsLottery) {
    retire to life of luxury;
  }
  else {
    keep job;
  }

Using JavaScript, let's look at an example of a working script:

  var userName=prompt("Enter your name","");

  if (userName=="Lee") {
    alert("Hey, nice name!");
  }

When this script is executed, if the name entered in the prompt box is "Lee," it will display an alert box that says: "Hey, nice name!"; otherwise, if any other action is taken (e.g., another name is entered; the name is entered in a different case; the box is left empty; or the "Cancel" button is pressed), the script will just end. Basically, the script says that if the variable userName is not true (not equal to "Lee") then don't do anything.

The Statement Block

The area within the curly brackets is called a "statement block." The curly brackets can be formatted in whatever format you wish. If you are only executing one statement, the curly brackets are not required, but it's good to use them even for one statement, in case you happen to add others later. The two most popular formats are:

  if (condition) {
    action to be taken
  }
  else {
    action to be taken
  }

and

  if (condition)
  {
    action to be taken
  }
  else
  {
    action to be taken
  }

We'll be using the first one.

home / programming / javascript / diaries / 5

[next]

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

webref The latest from WebReference.com Browse >
Working with the DOM Stylesheets Collection · Administering RBAC in PHP 5 CMS Framework · xref: Automatic Cross Referencing Script
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Combine BottomCount() with Other MDX Functions to Add Sophistication · Creating a Daemon with Python · The Coming Voice-over-WiMAX Revolution

Created: June 10, 2005

URL: