Boolean type
31
var iLike190M = true;
var ieIsGood = "IE6" > 0; // false
if ("web devevelopment is great") { /* true */ }
if (0) { /* false */ }
JS
¨ any value can be used as a Boolean
¤ "falsey" values: 0, 0.0, NaN, "", null, and undefined
¤ "truthy" values: anything else
¨ converting a value into a Boolean explicitly:
¤ var boolValue = Boolean(otherValue);
¤ var boolValue = !!(otherValue);
CSC309
for loop (same as Java)
32
var sum = 0;
for (var i = 0; i < 100; i++) {
sum = sum + i;
}
JS
var s1 = "hello";
var s2 = "";
for (var i = 0; i < s.length; i++) {
s2 += s1.charAt(i) + s1.charAt(i);
}
// s2 stores "hheelllloo"
JS
CSC309
while loops (same as Java)
33
while (condition) {
statements;
}
JS
do {
statements;
} while (condition);
JS
¨ break and continue keywords also behave as in Java
CSC309
Popup boxes
34
alert("message"); // message
confirm("message"); // returns true or false
prompt("message"); // returns user input string
JS
Arrays
35
var name = []; // empty array
var name = [value, value, ..., value]; // pre-filled
name[index] = value; // store element
JS
var ducks = ["Huey", "Dewey", "Louie"];
var stooges = []; // stooges.length is 0
stooges[0] = "Larry"; // stooges.length is 1
stooges[1] = "Moe"; // stooges.length is 2
stooges[4] = "Curly"; // stooges.length is 5
stooges[4] = "Shemp"; // stooges.length is 5
JS
CSC309
Array methods
36
var a = ["Stef", "Jason"]; // Stef, Jason
a.push("Brian"); // Stef, Jason, Brian
a.unshift("Kelly"); // Kelly, Stef, Jason, Brian
a.pop(); // Kelly, Stef, Jason
a.shift(); // Stef, Jason
a.sort(); // Jason, Stef
JS
¨ array serves as many data structures: list, queue, stack, ...
¨ methods: concat, join, pop, push, reverse, shift,
slice, sort, splice, toString, unshift
¤ push and pop add / remove from back
¤ unshift and shift add / remove from front
¤ shift and pop return the element that is removed
String type
37
var s = "Connie Client";
var fName = s.substring(0, s.indexOf(" ")); // "Connie"
var len = s.length; // 13
var s2 = 'Melvin Merchant';
JS
¨ methods: charAt, charCodeAt, fromCharCode,
indexOf, lastIndexOf, replace, split,
substring, toLowerCase, toUpperCase
¤ charAt returns a one-letter String (there is no char type)
¨ length property (not a method as in Java)
¨ Strings can be specified with "" or ''
¨ concatenation with + :
¤ 1 + 1 is 2, but "1" + 1 is "11"
More about String
38
¨ escape sequences as in Java: \' \" \& \n \t \\
¨ converting between numbers and Strings:
var count = 10;
var s1 = "" + count; // "10"
var s2 = count + " bananas, ah ah ah!"; // "10 bananas, ah
ah ah!"
var n1 = parseInt("42 is the answer"); // 42
var n2 = parseFloat("booyah"); // NaN
JS
¨ accessing the letters of a String:
var firstLetter = s[0]; // fails in IE
var firstLetter = s.charAt(0); // does work in IE
var lastLetter = s.charAt(s.length - 1);
JS
CSC309
Splitting strings: split and join
39
var s = "the quick brown fox";
var a = s.split(" "); // ["the", "quick", "brown", "fox"]
a.reverse(); // ["fox", "brown", "quick", "the"]
s = a.join("!"); // "fox!brown!quick!the"
JS
¨ split breaks apart a string into an array using a
delimiter
¤ can also be used with regular expressions (seen later)
¨ join merges an array into a single string, placing a
delimiter between them
40 JavaScript Object Hierarchy
The Browser Object Hierarchy
41
The Browser Objects (Global DOM)
42
name description
document current HTML page and its content
history list of pages the user has visited
location URL of the current HTML page
navigator info about the web browser you are using
info about the screen area occupied by
screen
the browser
window the browser window
The window object
43
¨ the entire browser window (DOM top-level object)
¨ technically, all global code and variables become
part of the window object properties:
¤ document, history, location, name
¨ methods:
¤ alert, confirm, prompt (popup boxes)
¤ setInterval, setTimeout clearInterval,
clearTimeout (timers)
¤ open, close (popping up new browser windows)
¤ blur, focus, moveBy, moveTo, print, resizeBy,
resizeTo, scrollBy, scrollTo
The document object (details soon)
44
¨ the current web page and the elements inside it
¨ properties:
¤ anchors, body, cookie, domain, forms,
images, links, referrer, title, URL
¨ methods:
¤ getElementById
¤ getElementsByName
¤ getElementsByTagName
¤ close, open, write, writeln
CSC309
The location object
45
¨ the URL of the current web page
¨ properties:
¤ host, hostname, href, pathname, port,
protocol, search
¨ methods:
¤ assign, reload, replace
CSC309