javascript. what is javascript? scripting (interpreted) language designed for the web beware:...
Post on 13-Jan-2016
247 Views
Preview:
TRANSCRIPT
Javascript
What is JavaScript?
• Scripting (interpreted) language designed for the web
• Beware: JavaScript is case sensitive
Why javascript?
• Supported by almost all browsers
• Very popular– Lots of scripts available for download
• Authoring programs such as Micromedia Flash and Director depend upon javascript
• External code libraries (*.js file)– Reuseable code
History
• Originally called LiveScript• Invented by Brendan Eich at Netscape, 1995• Named changed to JavaScript because of Java• Similar to Microsoft’s Jscript• ECMA (European Standards Group)
– Produced ECMAscript– JavaScript and JScript now based on ECMAscript
Objects
• JavaScript is object oriented– Web browser Window– HTML document
• Hierarchy defined by ‘dot syntax’– Car.trunk.sparetire– Window.document.garden
• Refers to the garden image in a document in a window
Instance
• An incarnation of an object– car.trunk.sparetire– ford.trunk.sparetire– gm.trunk.sparetire
Properties
• Instances of objects can have properties– Window.document.bgColor
Values
• Properties have values– ford.color=“green”;
Variables
• Type of variable is determined by the data in it.
• Var defines a global variable
• myNewVariable = 0;– Defines a local variable called myNewVariable
as a numeric value
• var myFavoriteColor = “teal”;Beetle.color = myFavoriteColor;
Arrays
• Collection of data (variable)
• Can hold any type of data
var spiceRack = new Array();
spiceRack[0] = “oregano”;
spiceRack[1] = “salt”;
spiceRack[2] = “pepper”;
Methods
• An action associated with an object
• Methods can take values– ford.slowDown(“fast”);– ford.slowDown(“slow”);
• Methods can be triggered by events
document.write(“Hi there!”);
Assignment Operators
var myAge = 39;myAge += 4;
// is the same as myAge = myAge + 4;myAge -=4;
// is the same as myAge = myAge – 1;myAge *= 4;
// is the same as myAge = myAge * 4;myAge /= 4;
// is the same as myAge = myAge / 4;
Comparison Operators
39 == 30 + 9 // returns true;
39 != 25 + 9 // returns true;
39 > 28 // returns true;
39 >= 39 // returns true;
39 <= 36 // returns false;
Comparison Operators
(15 == 10+5) && (33 == 28 + 3);
- And Logic
- Returns false
(15 == 10+5) || (33 = 28 + 3);
- Or Logic
- Returns true
Conditional Statements (if)
If (Condition){
statement 1;statement 2;
}Else{}
Conditional Statements (switch)
switch (expression) {case label1: //begins first case (action)
statement1;statement2;break;
case label2: //begins second casestatement3;break;
default:statement4;
}
Loop Statements (for)
For (initial value of a counter;
ending value;
increment)
{
statements;
}
Loop Structures (while)
While (condition is true)
{
statements;
}
Loop Structures (Do)
Do
{
statements;
} while (condition is true);
Functions
• Group of JavaScript statements• Invoked by JavaScript statements
function doSomething(parm1, parm2, etc){
var theVisitor = parm1;window.document.write(“Is this OK, “ + theVisitor + “?”);
}
Document Object Model
• Internal map of all objects on a Web Page• Hierarchy
Window Document
Form FieldsLinks
window.document.myForm.visitor.valueDocument.myForm.visitor.value
Events
• Objects encounter events
• Event Handler is the code that responds to an event
Write a JavaScript program that prints out even numbers from 0 to
10
Write a program that loads an array with the months of the year
and them prints them out.
top related