CIS101%20Introduction%20to%20Computing

1
CIS101Introduction 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
• numboth add 1 to value in num
• Can use before or after the variable

10
Decrement Operator

• The increment operator -- subtracts 1 from the
  value of a variable
• Example
• num--
• --numboth 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 (expression1expression2expression3)
• 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 1st 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 1st 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 101Lesson 08
• This weeks quiz
• Concepts, chapter 6, Output

23
Next class meeting

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