ITSE 1411 Beginning Web
Assignment 7

Reading

JavaScript Text, Chapter 3, pgs 146 - 157 (Repetition)

Discussion

• There is a typo on page 157, JavaScript text. The sentence should be
  The values in the salaries[] array that are lower than 50000 are...
  The book says higher.

• Repetition or looping is repeating a series of statements times
  1. a specific number of times
  2. until a specific value is found
  3. until a specific condition is met
• In JavaScript there are 3 types of loops
  • a while loop
  • a for loop
  • a do while loop
• All loops require
  1. an initialized value to test
  2. a condition that is tested
  3. a change of the value that is tested
• while statement
  • syntax of the while loop
    a value is set that will be used in the condition
    while (condition that tests the value)
    {
    code to be executed (and must change the value)
    }
    
    • when the condition evaluates to true
      • a block of code is executed
        this block of code must change the value that is tested in the condition or your loop will never end (called an infinite loop)
    • control returns to the conditional test
    • when the condition evaluates to false the line of code below the loop block is executed

Practice While statements

• Create an assignment7 folder (no spaces in the name, no uppercase) in your public_html folder.
• PilotQuiz5 page
  • If necessary, open your pilotQuiz4.htm page in your editor.
  • Save as pilotQuiz5.htm in your assignment7 folder.
  • Add the coding from pages 149 - 151 of the text.
  • Save the document.
  • Compare your work to Figure 3-12

do...while statement

• a do...while statement executes once, then tests to see if it is to be repeated.
• the block of code that is executed preceeds the condition.
• syntax of the do...while statement
  do {
  statements;
  }while (condition);
• The do...while loop is called a post test because the code is executed before the condition is tested.

Practice do...while statements

• PilotQuiz5 page
  • If necessary, open your pilotQuiz5.htm page in your editor.
  • Save as pilotQuiz6.htm in your assignment7 folder.
  • Add the coding from page 153 of the text.
  • Save the document.

for statements

• Coding example using a for statement
  • Click on JackhammerCache.html
  • Look at the animation.
  • Right click on the page and View Source.
  • Resize the window of the source code to the right half of the screen.
  • The JavaScript in the head accomplishes downloading the images before the setInterval() (used to keep calling the function at a set interval)
    • The jackhammers array has 11 elements.
    • There is a for loop which repeats code until a condition is met.
      • The syntax for a for loop is
        for(declare and define a variable; test a condition; update the value tested in the condition)
      • In this example, a variable i is created and initialized to 0.
        The value of i is tested to see if it is less than 11.
        i is incremented.
      • The order that the statements inside the parentheses are followed are:
        1. The declaration and definition are executed once at the start of the loop.
        2. The test of condition is performed
           • When the test is true, the statements within the loop are followed.
           • When the test is false, control moves to the statement below the end of the loop.
        3. If control stays in the loop, the statements within the loop are followed sequentially.
        4. At the end of the loop, control goes to the update of the value used in the condition.
      • This for loop will execute 11 times. The first time i will contain the value 0. The last time through the loop, i will be 10. Once i is incremented to 11, the test of condition fails, and the loop ends.
    • The statements inside the loop
      • jackhammers[i] = new Image();
        defines the first element of the array jackhammers to be an Image object.
      • jackhammers[i].src = "jackhammer" + i + ".gif";
        assigns the src attribute of the Image object to be the image jackhammer0.gif
      • if (i == 10)
        tests to see if i is equal to 10
        When i is equal to 10, the setInterval() function is called and begin is assigned true.
    • After the statements inside the loop are executed, control goes to the incrementation.
    • After the incrementation, the test of condition is executed and either the statements within the loop are executed again, or the loop is completed.

Practice for statements

• PilotQuiz5 page
  • If necessary, open your pilotQuiz6.htm page in your editor.
  • Save as pilotQuiz7.htm in your assignment7 folder.
  • Add the coding from page 156 of the text.
  • Save the document.

Case Project:

• Complete program example.
  • Open your template.htm page.
  • Save as numbers.htm in your assignment7 folder.
  • Write out the numbers between 1 and 100 using at least one loop.
    • Hint:
      • Create an outer loop that loops between 1 and 100.
      • Check to see if the number is less than 10
        • When the number is less than 10 write some blank spaces.
      • Write out the number.
      • Check to see if the modulus of the number is 0.
        • When the modulus of the number is 0, write a line break.
  • Your numbers should be written 10 to a row. You may NOT use 10 loops. Be sure that you have the validation icons on your page.
  • Save the document.

Update your index page:

• Add links on your index page to the pages in your assignment7 folder that are to be graded:
  • pilotQuiz7.htm
  • numbers.htm

Uploading:

• Upload your revised index.htm page to the public_html folder.
• Upload your assignment7 folder with the files:
  • pilotQuiz7.htm
  • numbers.htm

Testing uploaded pages

• Follow the checklist for grading shown on the schedule page.
• Make any corrections for any page that does not validate or display correctly.