CIS101 Introduction to Computing Week 12

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

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

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

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

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

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

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)

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

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

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 }

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

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

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

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 exactly as you see it Click preview button to test out the code

Student Modifications Execute the code on p 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

Shaking the window Code on p 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

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

Student Modifications (cont.) Modify the code on p 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

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

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

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

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