!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Lecture 9
JavaScript (part 3)
Ketan Mayer-Patel
University of North Carolina
Arrays
var a = new Array();
var b = new Array(1, 2, "three");
var c = [];
var d = [1, "hello", ["a", "sub", "array"]];
Elements do not have to be the same type.
Arrays, cont'd
- Subscript with []
- Array length property
Arrays, cont'd
- Arrays auto fill to highest index set.
- Auto filled with undefined
var a = new Array();
var a[0] = "an_item"; // a.length is 1
var a[99] = "another"; // a.length = 100
Arrays, cont'd
- Lots of useful methods
- reverse(), sort(), slice(), splice(),
- push(), pop(), shift(), unshift()
- Example - Arrays
Conditional Execution
if (expression1) {
// Execute if expression1 is true
} else if (expression2) {
// Execute if expression1 is false and
// expression2 is true
} else {
// optional
// Execute if no if expressions true
}
Conditional Execution, cont'd
switch(expression) {
case val1:
// Execute if expression matches val 1
break;
case val2:
// Execute if expression matches val 2
break;
default:
// Optional
// Execute if expression does not match any value
}
Example - if and switch
Looping Execution
while (expression) {
// Execute while expression remains true.
}
Looping Execution, cont'd
for(initialization; condition; update) {
// Execute until condition remains true.
}
Initialization expression evaluated once at beginning.
Update expression evaluated at end of body each time through.
For both for and while loops:
- break - exits loop immediately
- continue - skips rest of loop body
Example - while and for
Looping over the values of an array
- Very common thing that needs to be done.
- Best practice: use a for loop.
- Don't change length of array in body of for loop
- You can declare the indexing variable in the for loop if you do not need it outside of the for loop body.
- Example - for loop to iterate over an array
Functions
- Defining functions
- Parameter list (possibly empty)
- Variables in parameter list are local to function body.
- return statement
- Exits function and returns value as result.
function f(x) {
return x*x;
};
var f = function(x) {
return x*x;
};
var f = new Function("x", "return x*x;");
Functions as objects
- Functions are first-class objects
- Can be stored in a variable or an array.
- Can be copied from one variable to another.
var f = function(x) {return x*x;}
var g = f
var r = g(3); // r now contains the value 9
Calling Functions
- Variable or expression that is a function object followed by parameter list in ()
- Can use expressions as parameter values
- Including return values from calling other functions.
- Functions can call other functions.
- And even themselves - recurssion
f(1,2,3);
g("hello" + "world", 1+(2*3));
Example - Calling functions
Objects
- A collection of named properties and methods
- A method is a function associated with an object
- A class is a specific type of object.
- Array
- Date
- Function
- Document
- ...
- Classes organized into a hierarchy
- Object class is at the top of this hierarchy
Creating Objects
- From constructor of a specific class.
var d = new Date();
Generically as a literal
var my_obj = {prop1:value1, prop2:value2};
Instance
- What's an instance?
- A specific object
- More than one variable can be set to the same instance.
var a = new Date();
var b = a;
var c = b;
// Now all three variables refer
// to the same instance.
b = new Date();
// Now a and c refer to one instance,
// and b to another.
Using and defining methods
- A method is an object property that is set to a function object
- You call an object's method just like using a function.
- The this keyword
- Set to the object instance that the method belongs to.
- Creating a new method for a specific object
var o = {};
o.meth1 = function() {...
Example - creating and using object methods
Value Types vs Reference Types
- Value types
- Numbers, boolean, strings
- Passed to functions/methods by value.
- Value is copied when passed.
- Any changes not reflected in original value.
- Reference types
- Arrays and objects
- Passed to functions/methods by reference.
- Changes are reflected in original.
- Example - value vs. reference types.
JavaScript Readings and Resources