1. CIS101 Introduction to Computing Week 12

2. Agenda Your questions Solutions to practice text Final HTML/JavaScript Project Copy and paste assignment JavaScript: Loops This week online Next class

3. In class exam Next class meeting Solutions to practice exam posted in Blackboard

4. Final Project Create a Web site using JavaScript/HTML Team project Both members must actively participate in presentation (reflected in grade) Topic is up to you, but must be appropriate for college assignment See assignments week 12 for details

5. Lesson Topics Introduction to loops The advantages of loops Increment and decrement operators For loop and while loop syntax Controlling loops with conditional expressions

6. Loops A powerful feature computers is the ability to repeat steps over and over as many times as necessary Programming languages include statements that define a section of code that repeats The generic name for a programming statement that repeats is a loop The set of statement which is repeatedly executed is called the body of the loop

7. Controlling loops Loops repeat code over and over, but eventually they do have to stop Common way to control loops is to repeat a section of code a certain number of times This requires counting how many times the loop has repeated, then stopping when the right number has been reached

8. Counting with the increment and decrement operators JavaScript uses the increment and decrement operators for counting Increment means increase (get larger), decrement means decrease (get smaller)

9. Increment operator The increment operator ++ adds 1 to the value of a variable Example: num++; ++num; both add 1 to value in num Can use ++ before or after the variable

10. Decrement Operator The decrement operator -- subtracts 1 from the value of a variable Example: num--; --num; both subtract 1 from value in num Can use -- before or after the variable

11. The for Loop The for loop repeats a section of code a specific number of times Syntax: for (expression1;expression2;expression3) { statements to be repeated go here }

12. The for Statement (cont.) The for statement has three parts part 1: Initializes the control variable in expression1 part 2: Tests expression2. If it is true, the body of the loop repeats part 3: Update the value of the control variable using expression3 Repeats steps 2 and 3,until expression2 becomes false

13. The while Loop The while loop is repeats until its condition is false Syntax: while (condition) { Statements to be repeated } Where condition is a true or false test

14. The while Loop (cont.) The while loop is implemented using the following steps Step 1: The condition is tested to see whether it is true or false Step 2: If condition is true, the loop body repeats Repeats steps 1 and 2 until condition becomes false

15. In the lab You will use loop statements in your code Create a new HTML document using 1 st Page 2000 Save html file in new folder named Loops on your desktop with name lesson0801.htm Copy star.gif from F: drive into Loops folder Enter the code on p. 8-10 exactly as you see it Click preview button to test out the code

16. Student Modifications Execute the code on p. 8-10 using different values Find and display another image in the loop body Re-write the code using a while loop instead of a for loop

17. Shaking the window Code on p. 8-12 uses two loops to shake the browser window back and forth One loop inside another is called a nested loop Save your previous work, create a new document named lesson0802.htm

18. Shaking the window cont. Copy the code from p. 8-12 Save your file, then open it from the browser This will not work in preview mode in 1 st Page 2000

19. Student Modifications (cont.) Modify the code on p. 8-12 as follows: Add a second button that calls the function shake() with a different value for the parameter Use the onLoad event handler to shake your window as soon as it loaded

20. Lesson Summary Loops are sections of code that repeat over and over JavaScript statements that repeat include the for loop and the while loop The increment operator and the decrement operator are used to control loops How to use the onLoad event handler

21. Final Project Use remaining class time to meet with team member to plan final project

22. This week online Readings Concepts, chapter 6, “Output” JavaScript 101 Lesson 08 This week’s quiz Concepts, chapter 6, “Output”

23. Next class meeting In class exam covering Excel, HTML, JavaScript Final presentations during final exam time