History of Java and JavaScript
Oak and Coffee?
ECMAscriptEuropean Computer Manufacturers Association
JScript?
Java vs. JavaScript
JavaMore Complicated
Requires JDK
Programs compiled and saved as different files
Powerful object language
JavaScriptEasy to learn and use
No JDK
Scripts right in HTML
Simple Tasks
Running JavaScriptLook on page 8.05 - Recommend you work through this
<script src=url language=“JavaScript">
commands
</script>
Using the HEAD tag to your advantage.
Hiding JavaScript<script language=“JavaScript">
<!--hide script from browsers that don’t support javascript
all your javascript cool commands
//stop hiding from those browsers -->
</script>
Displaying Text
<script language=“JavaScript">
document.write("First statement ");document.write("Second statement ");document.write("Third statement ");document.write("<br>");document.writeln("First statement ");document.writeln("Second statement ");document.writeln("Third statement ");
</script>
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 operatorsvar Year=2002;
document.write(Year);
document.write("The year is " + Year);
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 calledgetDate();
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();
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
Assignment Operatorsx = 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 scriptfunction function_name(parameters){
JavaScript Commands
}
{Command Block}
Action Function
function ShowDate(date) {
document.write("Today is " + date + "<BR>");
}
-------in Web Page-----------var Today = “04/20/02";
ShowDate(Today);
Placing Functions
Definitions in <head></head>: Interpreted before called
Browser passes over command block until it is called in the HTML file. . .
Weekdayvar Month = new Array();
Weekday[0]="Sunday";
Weekday[1]="Monday";
Weekday[2]="Tuesday";
Weekday[3]="Wednesday";
Weekday[4]="Thursday";
Weekday[5]="Friday";
Weekday[6]="Saturday";
Examplevar 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]);
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
}
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
http://unix.cc.wmich.edu/rea/380/resources/
Ask questions
Help one another
Top Related