CSIS 138 JavaScript Class3

768 views

Published on

Instructor Teresa Pelkie at Palomar College - "switch" statement, arrays, loops

Published in: Education, Technology, Lifestyle
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
768
On SlideShare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
30
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • The JavaScript Language consists of objects CSIS 138 Instructor Teresa Pelkie Class 3 - Summer 2008
  • CSIS 138 JavaScript Class3

    1. 1. JavaScript – Class 3 <ul><ul><li>String object </li></ul></ul><ul><ul><li>toLowerCase() </li></ul></ul><ul><ul><li>toUpperCase() </li></ul></ul><ul><ul><li>Switch statement </li></ul></ul><ul><ul><li>Arrays </li></ul></ul><ul><ul><li>loops </li></ul></ul>
    2. 2. String Object – comparing strings var answer = “xyz”; stringName. toLowerCase() ; stringName. toUpperCase() ;
    3. 3. String Object var answer = prompt(&quot;What breed of dog was Lassie?&quot;, &quot;&quot;); if (answer == &quot;collie&quot;) { document.write(&quot;Yes, that is correct!&quot;); }
    4. 4. var answer = prompt(&quot;What breed of dog was Lassie?&quot;, &quot;&quot;); if (answer. toLowerCase() == &quot;collie&quot;) { document.write(&quot;Yes, Lassie was a collie!&quot;); } else { document.write(&quot;No, you are wrong!&quot;); } comparison
    5. 5. Switch Statement For checking a condition when there are a large number of possibilities Can be used in place of an if else if What it contains: • the test statement - the expression/condition to test • the case statements - the possible answers • the break statements – stops checking after a match is • the default statement –executes if none of the possible answers are found
    6. 6. var theDay= prompt(&quot;What day is the fourth of July?&quot;, &quot;&quot;); switch ( theDay.toLowerCase()) -> the test expression– what we are comparing { case “monday”: execute some code; break; case “tuesday” : execute some code; break; default: -> - the default statement - if nothing matches, this will execute execute some code; break; } See pages 4-6 handout and sample code files Double quotes for a literal/string
    7. 7. the Array Object – (chapter 2) • Similar to a variable except that it can hold more than one item of data at a time • Each piece of data stored is referred to as an element • Each element is referenced by a number or an index • The index number is enclosed in brackets – [ ] • Arrays start with the number 0 • Arrays have a length property , which is the number of elements in the array • Arrays are defined with the JavaScript key word “ new ” • The length of the array minus 1 gives the number of the last index
    8. 8. Declaring an Array var myArray = new Array() or var myArray = new Array(4) We are creating a “ new ” instance of the “ Array() ” object keyword keyword Array object – upper case “A”
    9. 9. Listing the elements in an array var dogs = new Array(); dogs[0] = &quot;Missy&quot; ; dogs[1] = &quot;Letty&quot; ; dogs[2] = &quot;Andy&quot; ; dogs[3] = &quot;Terri&quot; ; var dogs = new Array(“Missy”, “Letty”, “Andy”, “Terri”); ______________________________________________ Returning the value of the array elements : document.write(&quot;my first dog is &quot; + dogs[0] + &quot;<br>&quot;); document.write(&quot;my second dog is &quot; + dogs[1] + &quot;<br>&quot;); see page 8 index position 0
    10. 10. Loops A loop is a type of JavaScript statement that repeats a block of code over and over again if a condition evaluates to true Two kinds of loops -– a “ for ” loop and a “ while ” loop • Use the “ for ” loop when you know , or can determine by a calculation, the number of times you want to repeat the code • Use the “ while ” loop when you do not know how many times you will need to repeat the block of code
    11. 11. The “for” loop – Commonly used with an array • Repeats a block of code for a certain number of times • When you know or can determine how many times to repeat the code • Involves some kind of counter that is incremented as long as the condition is true
    12. 12. The “for in” loop – ONLY used with an array • Repeats a block of code for a certain number of times • When you know or can determine how many times to repeat the code • Involves some kind of counter that is incremented as long as the condition is true var elementIndex; var myArray(); for (elementIndex in myArray) { document.write(myArray[elementIndex] + “<br>”); }
    13. 13. for loop - Pages 9 -11
    14. 14. for in loop - Page 12
    15. 15. for in loop - Page 12
    16. 16. while loop • Allows you to test a condition and keep on looping as long as the condition is true; will stop when the condition is false • If the condition is false to begin with, it will never loop • Used when you don’t know the number of times you need to loop • You must increment the counter in the code to execute or it will loop indefinitely and the computer will crash ☺ var counter; counter = prompt(&quot;Enter a number from 1 to 10&quot;, &quot;&quot;); while (counter <= 10) { document.write(&quot;this is count number &quot; + counter + &quot;<br><br>&quot; ); counter++ }
    17. 17. <ul><li>do while loop </li></ul><ul><li>Same as the while loop except </li></ul><ul><ul><li>The test condition is at the bottom </li></ul></ul><ul><ul><li>Will always loop at least once </li></ul></ul><ul><li>var counter; </li></ul><ul><li>counter = prompt(&quot;Enter a number from 1 to 10&quot;, &quot;&quot;); </li></ul><ul><li>do </li></ul><ul><li>{ </li></ul><ul><li>document.write(&quot;this is count number &quot; + counter + &quot;<br><br>&quot; ); </li></ul><ul><li>counter++ </li></ul><ul><li>} </li></ul><ul><li>while (counter <= 5) </li></ul>
    18. 18. <ul><li>Assignment 3 </li></ul><ul><li>Looping through an array of URLs </li></ul><ul><li>Concatenating a variable with HTML to produce a hypertext link </li></ul><ul><li><a href=”http://variable”>variable</a> </li></ul><ul><li>document.write (‘<a href=”http://’ + variable + ‘”>’ + variable + ‘</a>’); </li></ul><ul><li>note the double quotes inside the document.write() </li></ul>

    ×