JavaScript Friend or Foe?

History of Java and JavaScript Oak and Coffee? ECMAscript European Computer Manufacturers Association JScript?

What Side? Server-Side CGI Client-side JavaScript

Java vs. JavaScript Java More Complicated Requires JDK Programs compiled and saved as different files Powerful object language JavaScript Easy to learn and use No JDK Scripts right in HTML Simple Tasks

Running JavaScript Look on page Recommend you work through this commands Using the HEAD tag to your advantage.

Hiding JavaScript <!--hide script from browsers that don’t support javascript all your javascript cool commands //stop hiding from those browsers -->

Displaying Text document.write("First statement "); document.write("Second statement "); document.write("Third statement "); document.write(" "); document.writeln("First statement "); document.writeln("Second statement "); document.writeln("Third statement ");

Can I quote you on that? Single and double quotation marks for syntax: document.write("Come meet David ‘Bud’ Davis"); All JavaScript commands are case sensitive!!!

Variables and Data (8.11) Variable: a named element in a program used to store and retrieve data Given values with assignment operators var Year=2002; document.write(Year); document.write("The year is " + Year);

4 Types of Variable Values (Data Types) Number String Boolean variables Null value

Declaring a Variable (8.13) Month="December"; var Month; Month=“December”; var Month="December"; Notice the ;

Dates (Objects, not getting them) Data Objects: an object containing date information new (keyword) var SomeDay = new Date("June, 15, 2001, 14:25:00"); var SomeDay = new Date(2001, 5, 15, 14, 25, 0); Today = new Date();

Extracting Day Information (8.17) Need to now extract the information from Today Use a Method called getDate(); var Day = Today.getDate(); document.write(Day); Day will contain day of the month DateObject (Today) contains complete date and time information

Month and Year Information var Today = new Date(); var Month = Today.getMonth()+1 var Today = new Date(); var Year = Today.getYear();

The Y2K problem getYear() in Navigator 98, 99, 2000, 2001 in Explorer 98, 99, 100, 101

The Solution var Year = Today.getFullYear();

Expressions and Operators Expressions -- JavaScript commands that assign values to your variables Operators -- like + operator var ThisMonth = Today.getMonth()+1;

Expressions and Operators document.write("Only " + DaysLeft + " days until Christmas"); Look at table on 8.20

Operators Binary operators (work on two elements in an operation) Unary operators (work on one variable) Increment operators (increase variable by 1) Decrement operator Negation operator

Logical and Comparison Operators Comparison x < 100; y == 20; Logical (x < 100) && (y==20);

Logical and Comparison Operators Assignment Operators x = x + y; x += y; Both examples x variable is added to y and stored in x. x = x +2; x += 2;

JavaScript Functions (8.22) Way to save time and reuse script function function_name(parameters){ JavaScript Commands } {Command Block}

Action Function function ShowDate(date) { document.write("Today is " + date + " "); } in Web Page var Today = “04/20/02"; ShowDate(Today);

Placing Functions Definitions in : Interpreted before called Browser passes over command block until it is called in the HTML file...

Return of JavaScript Creating Arrays Working with Loops and Conditionals

Arrays (8.32) An ordered collection of values referenced by a single variable.

Weekday var Month = new Array(); Weekday[0]="Sunday"; Weekday[1]="Monday"; Weekday[2]="Tuesday"; Weekday[3]="Wednesday"; Weekday[4]="Thursday"; Weekday[5]="Friday"; Weekday[6]="Saturday";

Syntax var Month = new Array(); Month[11]="December"; Automatically Populated with null values

Example var Weekday = new Array(); Weekday[0]="Sunday"; Weekday[1]="Monday"; Weekday[2]="Tuesday"; Weekday[3]="Wednesday"; Weekday[4]="Thursday"; Weekday[5]="Friday"; Weekday[6]="Saturday"; var DayofWeek = Today.getDay(); document.write("Today is " + Weekday[DayofWeek]);

Loops (8.37) A set of instructions that is executed repeatedly... For While

For For(start; stop; update) { JavaScript Commands }

For... for(Num=1; Num<4; Num++) { document.write("The value of the Num is " + Num + " "); }

The value of the Num is 1 The value of the Num is 2 The value of the Num is 3

While while(condition) { JavaScript Commands }

While var Num=1 while(Num<4) { document.write("The value of the Num is " + Num); Num++ }

For versus While In the example the results are the same You would use a While loop in situations where no counter is available you want to run a loop while a condition exists

Conditional Statements [8.28] Runs only if certain conditions are met. if(condition) { JavaScript Commands }

Weekend? if(Day=="Friday"){ document.write("Have a nice weekend!"); }

Modulus Year % 4 == 0 (Evenly divisible by 4 -- No remainder) if(Year % 4 == 0) { MonthCount[2]=29; }

If... Else Structures [8.30] If(condition) { JavaScript Commands if true } else { JavaScript Commands if false }

Weekend or Work? if(Day=="Friday"){ document.write("Have a nice weekend!"); } else { if(Day=="Monday") { document.write("Ha-Ha"); } else { document.write("You're either enjoying your weekend or working toward it."); } Note: You'll want string on one line or break string up and use concatenation.

Recommendations Work through tutorial File can be downloaded off of resources page--Class/Course Technology Files Ask questions Help one another