typeof, Assignments, and the Date Object

The operators
```
typeof x //and
typeof(x)
```
returns either "boolean", "string", "number" if x is of primitive type, it returns "object" if x is null or an object; and it returns "undefined" if x is not defined.
Assignments in Javascript are similar to C or Java:
```
a++; a+=2; a--; a-=2; a = b +57;
```
The Date object is useful for getting information about the current date and time:
```
var today = new Date();
```
Date supports methods: toLocaleString, getDate, getMonth, getDay,getFullYear, getTime, getHours, getMinutes, getSeconds, getMilliseconds

I/O

The default output target of a Javascript I/O is the browser window.
Javascript models an XHTML document as a Document object.
The window in which this document is displayed is a Window object.
Window has two properties document and window. Here document refers to the current Document object.
Document has several useful methods for I/O. write, writeln.
In addition to this method of I/O one can also create dialogs with the alert, prompt, and confirm methods. For example,
```
name = prompt("What is your name", "John Smith")
```

Control Statements

Javascript supports the relational operators: ==, !=, <, >, <=, >=, ===, !==
The last two operators disallow conversion of either operand. So "3" === 3 evaluate to false.
Javascript also supports the operators &&, ||, !
Selection statements in Javascript are like in C/Java: if( a >b){} else{}
Javascript supports switch/case as in C/Java
Javascript supports while, for and do-while loops

Objects

Objects can be created with an initial declaration like:
```
var my_object = new Object();
```
This object would initially have no properties. To delete an object use: delete my_object;

An assignment like:

my_object.make= "V6" /* would then give a property make a value. */
//can access as
p = my_object["make"]
q = my_object.make

You can also nest objects this:
```
my_object.subObject = new Object();
```
You can loop over properties using:
```
for(var prop in my_object){...}
```

Arrays

Arrays can be created with the syntax:

var myArr = new Array(1, 2, "hello")
var myArr = new Array(100);
var myArr = [1,2,3];
//to access
myArr[0]
//to determine length
myArr.length

More Arrays

The Array object in Javascript has several useful methods for manipulating arrays.

join --- can be used to make a string out of an array.

var names = new Array("Mary", "Murray", "Max");
var nstring = names.join(":");

concat --- can be used to add elements to an existing array.
```
var a = [1, 2, 3];
a.concat(4, 5);
```
slice(i,j) --- return a sublist from the i to the j element.
push, pop, shift, unshift --- stack-like operations

Functions

A Javascript function definition consists of two parts:
1. a function header consisting of
  - the keyword function
  - an identifier
  - a parenthesized list of parameters
2. a compound statement

Function Example

function swap(i, j, a)
{
	var tmp=a[i]; /* explicitly defined variables 
                         have scope within the function
                         if I had declared the variable 
                         implicitly it would have global scope */
	a[i] = a[j]; a[j] = tmp;
}

This function could be called with a syntax like:
```
swap(10, 5, b);
```
A return statement can be used to return a value from a function.
Functions are objects so can be assigned to variables.
```
var b = swap;
```
The definition of a function does not need to list its arguments. One can obtain a list of arguments using the argument subobject of a Function.
```
function swap()
{ var i = this.arguments[0], j=this.arguments[1], a=this.arguments[2];
  //same code as before
}
```

Constructors

Javascript constructors are special methods that create and initialize the properties for newly created objects. For example,

function car(new_make, new_model, new_year)
{
   this.make = new_make;
   this.model = new_model;
   this.year = new_year;
}

I could then create an object with

my_car = new car("Ford", "Contour SVT", "2000");

Methods

To create methods, I can do things like the following way to create a display method to pretty print cars:

function display_car()
{
document.write("Make:", this.make, "<br />");
document.write("Model:", this.model, "<br />");
document.write("Year:", this.year, "<br />");
}
function car(/*same as before*/)
{ //same as before
this.display = display_car;}

The drawback of this is that each time we create a new car we have a separate pointer to display_car. Instead, we can use the prototype property of the car function. This will only create one pointer.
```
function car(/*same as before*/)
{ //same as before}
car.prototype.display = display_car;
```

Pattern Matching

Frequently in Javascript we will be manipulating strings using pattern matching, so it is useful to know what facilities are available for this.
Javascript pattern matching is modeled on Perl's regular expressions.
A pattern is an expression between / /.
In such a pattern normal characters match themselves.
In addition to normal characters there are special characters: \ | ( ) [] {} ^ $ * + ? .

As an example:

var str = "Rabbits are furry";
var position = str.search(/bits/); /* returns position of first occurrence */

Pattern Special Characters

. -- matches any single character. So /snow./ would match snows and snowy
() -- used to control order of matching /(ab)*/ matches ab, abab, but not aab
[] -- logical or of a group of patterns
[azf] matches an "a", a "z", or an "f".
[a-d] - matches the range a,b,c,d
^ -- acts as negation or as a start of string anchor. So [^abc] is any character other than a, b, c; /^abc/ matches abc at the start of a string.
$ -- acts an anchor to end of a string. /abc$/ matches abc at the end of a string.
\ -- either can be used to escape characters (so \. would match a period), or for one of a list of special escape patterns such as \r \t, \n, \f or

Slash Patterns

\d -- match a digit,
\D -- match anything other than a digit
\w match a word character (alphanumeric)
\W match a not a word character.
\s match a single whitespace character
\S match a single nonwhitespace character

Yet more special characters

* -- matches 0 or more occurrences of the pattern. For example /x*/ would match x, xx, xxx ...
+ -- matches 1 or more occurrences of the pattern
? -- matches 0 or 1 occurrences of the pattern
{} -- can be used to match exactly k occurrences:
```
/yx{5}z/ matches yxxxxxz	
```

Pattern Modifiers

i -- makes the pattern case insensitive. For example,
```
/Apple/i would match APPLE, aPple and apple.
```
x -- allows whitespace to occur in the pattern
g-- means do globally - we'll see this more on the next slide

More Pattern Methods

replace -- replace the matched pattern with the given replacement string.
```
var str="Fred, Freddie, Frederica";
str.replace(/Fre/g, "Boyd");
```
notice we use g to replace all occurrences.

match -- returns an array of the pattern matched results

var str= "3 and 4";
var matches = str.match(/\d/g); //returns [3, 4]

split -- splits a string into an array of substrings according to the pattern delimiter

var str="grapes:apples:oranges"
var fruit = str.split(":"); // [grapes, apples,oranges]

More Javascript

Outline