Home arrow JavaScript arrow Page 4 - The Power of Javascript: Controlling the Execution of the Script
JAVASCRIPT

The Power of Javascript: Controlling the Execution of the Script


When you write a script, most of the time you need to make a decision based on the values of some of your variables, or based on the values entered by the users, or even based on user actions. Decision making is a fundamental building block for all programming languages and it's similar in most of them. In this article, we discuss the if/else statement block, the switch statement, and take a look at the prompt() dialog box.

Author Info:
By: Michael Youssef
Rating: 5 stars5 stars5 stars5 stars5 stars / 12
August 09, 2005
TABLE OF CONTENTS:
  1. · The Power of Javascript: Controlling the Execution of the Script
  2. · The if statement
  3. · The if statement example
  4. · Advanced if statements (else if and else)
  5. · The switch statement
  6. · The switch example

print this article
SEARCH DEVARTICLES

The Power of Javascript: Controlling the Execution of the Script - Advanced if statements (else if and else)
(Page 4 of 6 )

We have used the if statement to execute a block of code (one statement or more) depending on the value produced from its boolean expression. The if statement doesn't limit this capability. You can use the else block to form an if/else block in which, if the boolean expression evaluates to true, the if statement (or block) executes as we have seen in the above example -- but the new part is that, if the boolean expression evaluates to false, the else block gets executed. So our new if/else statement is written like this:

if(boolean expression)
  statement;
else
  statement;

In the case of a code block, it's written like this:

if(boolean expression)
{
  statement 1;
  statement 2;
  statement 3;
}
else
{
  statement 1;
  statement 2;
  statement 3;
}

Note that the else block executes if the boolean expression evaluates to false, so we don't place parentheses after else because there's no expression to be evaluated. Let's extend our example to include the else statement. Copy the following code and save, then load it.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <title>Hello World</title>
    <script language="JavaScript" type="text/javascript">
      var someText; 
      someText = prompt("Please enter some text", "I like Javascript");
      if (someText == "I like Javascript")
      {
        alert("You have entered the default text");
      }
      else
      {
        alert("You have written: "+ someText);
      }
      document.write("This is the first statement after the if statement");
    </script>
  </head>
  <body> 
  </body>
</html>

When you load the document, the dialog box prompt is displayed. Type anything other than the string value "I like Javascript." I typed "The title of this page is Hello World"

When you click OK a message box is displayed with the text you just written.

When we have written a string value other than the one we check on in the boolean expression ("I like Javascript"), the boolean expression evaluates to false, then the else statement executes, which uses the alert() functionality to display what we have written. This may confuse you so let's think about it again. When the interpreter assigns the value to someText variable, it knows that this value returns (comes from) the prompt box using the prompt() functionality. The Interpreter displays the prompt box and we enter the value "The title of this page is Hello World" and this is the value that the interpreter assigns to someText.

When the interpreter evaluates the boolean expression of the if statement and produces the value false, it executes the else block, which displays the value of someText in the message box. I know that this may be a little bit difficult for you, but programming is fun, and when we discuss client-side Javascript, you will like it more.

There's one limitation to using the if/else statement. As we have seen, we are testing the value of the variable someText. If it's "I like Javascript" the if block executes, otherwise the else block executes. Javascript (like most programming languages) supports the else if statement, which is better explained with an example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <title>Hello World</title>
    <script language="JavaScript" type="text/javascript">
      var someText;
      someText = prompt("Please enter some text", "I like Javascript");
      if (someText == "I like Javascript")
      {
        alert("You have entered the default text");
      }
      else if (someText == "I like scritping languages")
      {
        alert("you like scripting languages"); 
      }
      else
      {
        alert("You have written: "+ someText);
      }
      document.write("This is the first statement after the if statement");
    </script>
  </head>
  <body>
  </body>
</html>

Save and load this document into your browser. Enter the value "I like scritping languages" into the dialog box prompt.

The text you just entered will be displayed in the message box.

As you can see, the else if statement gives us the ability to go further with the expression in question. It's much more like dividing the else statement into more than one block that further tests the value. When the else if expression evaluates to true, it executes the statement block associated with it, then escapes all the following else if statements (if there are any) along with the else block and continues to the first statement after the else block (or we can say after the whole if/else structure).


blog comments powered by Disqus
JAVASCRIPT ARTICLES

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 

Developer Shed Affiliates

 




© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials