ECA 225 Applied Online Programming basics ECA 225

ECA 225 Applied Online Programming basics ECA 225 Applied Interactive Programming 1

Java. Script: What it is v client-side, interpreted scripting language v v Java. Script is run and interpreted by the user’s browser adds interactivity to web pages interact with a visitor v respond to a visitor’s actions v create slideshows v create new windows v write cookies v validate form input v v Object-based ECA 225 Applied Interactive Programming 2

Java. Script: What it is NOT v it is NOT Java v. Java apps run independent of web pages v. Java is a strongly typed language v it is NOT a way to process form input safely ECA 225 Applied Interactive Programming 3

Java. Script – Client Side 1. 2. 3. 4. 5. Request for HTML files Connection to server Response Files stored in browser cache Users views files, including Java. Script, from cache ECA 225 Applied Interactive Programming 4

Java. Script – Client Side v v The software that interprets Java. Script is the browser We will use Java. Script to write HTML Java. Script, like HTML, has cross-browser compatibility issues ECMA v European Computer Manufacturers Association ECA 225 Applied Interactive Programming 5

Events actions performed by a user, eg: v on. Click: when user clicks the mouse v on. Load: when a web page finishes loading into the browser v on. Mouse. Over: when a user rolls the mouse over an object v on. Focus: when an object such as a form text box is selected scripts can be associated with any of these events ECA 225 Applied Interactive Programming 6

Syntax v <script> tagset with a couple of exceptions, all Java. Script that we write will be placed inside opening and closing <script> tags v do not place any HTML inside <script> tags, unless it is being written by your script v attributes for the <script> tags v language=“javascript” v type=“text/javascript” v src v < script language=“javascript” type=‘text/javascript” > ECA 225 Applied Interactive Programming 7

Syntax v case cont … sensitivity v keywords, variables, function names are case sensitive v First. Name does not match firstname v Boolean value of True will produce an error – correct value is lowercase true v whitespace v Java. Script ignores whitespace – use tabs, indents, carriage returns to make code readable ECA 225 Applied Interactive Programming 8

Syntax cont … v reserved words v may not be used as variable or function names for a list, see my website v semicolons v semicolon to end statements is optional in Java. Script v use of a semicolon, however, is good programming practice v may make it easier to debug problems ECA 225 Applied Interactive Programming 9

Syntax cont … v comments v to comment a single line use two forward slashes // this is a comment v to comment a block of code use /* */ /* These symbols comment a whole block of code */ ECA 225 Applied Interactive Programming 10

Syntax cont … v comments v use comments to v document why you are doing something in a particular way v document the logic of a program v label parts or sections of code v debug *** To receive full credit for lab assignments, your code must be documented with comments *** ECA 225 Applied Interactive Programming 11

Where to put Java. Script v Java. Script can be placed just about anywhere inside an HTML document v <head> tagset v place most of your code here, especially functions, variables, etc, which must be defined before the entire page loads v <body> tagset v if your code generates HTML, place it in the body, precisely where the generated HTML will appear v Code may appear in both sections at once ECA 225 Applied Interactive Programming 12

Hiding from older browsers v to hide Java. Script code, place it inside HTML comment tags < ! - - HTML comment v code --> would look like this: <script language=“javascript” type=“text/javascript” > <!-Java. Script code // - - > </script> ECA 225 Applied Interactive Programming 13

Data Types v Numbers v Strings v printing single and double quotes v Boolean Yes/No v null v undefined 1/0 True/False Type Conversion ECA 225 Applied Interactive Programming 15

Variables a place in computer memory that temporarily stores a value v Naming Rules: v first character must be a letter or an underscore v following characters can be letters, numbers, or underscores v no spaces in variable name v case sensitive v no keywords v make the variable name descriptive ECA 225 Applied Interactive Programming 16

Variables cont … v It is good programming practice to declare a variable before using it with var keyword v Declare multiple variables using comma operator v Until assigned a value, a variable is undefined v Assign a value using the assignment operator ( = ) v read the assignment operator as “gets the value of” rather than “equals” var first_name = “Bob”; ECA 225 Applied Interactive Programming 17

Operators + + * / % ++ -- Addition Concatenation Subtraction Multiplication Division Modulus Increment Decrement parse. Int( ) changes string to number ECA 225 Applied Interactive Programming 18

Operators examples addition total = tax + subtotal; subtraction range = begin. Date – end. Date ; multiplication tax = tax. Rate * subtotal ; ECA 225 Applied Interactive Programming 19

Operators examples division monthly. Ave = number. Of. Times / number. Of. Months modulus (remainder) remainder = counter 1 % counter 2 remainder = 7 % 3; // answer is 1 ECA 225 Applied Interactive Programming 20

Concatenation v to combine, to connect, to link in a chain v concatenation operator is + v do not confuse with addition var first_name = “Bob”; var last_name = “Palmer”; var full_name = first_name + “ “ + last_name; ECA 225 Applied Interactive Programming 21

Concatenation cont … v example var first. Name = “Bob”; var last. Name = “Palmer”; var city = “Canton”; var state = “Ohio”; variables string literals document. write( “My name is “ + first. Name + “ “ + last. Name + “. I live in “ + city + “, “ + state + “. ” ); ECA 225 Applied Interactive Programming 22

Operators examples increment + + increases a variable by 1 counter = counter + 1; counter++; ++counter; ECA 225 Applied Interactive Programming 23

Operators examples increment ++ var x = 10; counter = 1; total = x + counter++; // total is 11, counter becomes 2 total = x + ++counter; // total is 12 ECA 225 Applied Interactive Programming 24

Operators examples decrement – – decreases a variable by 1 counter = counter – 1; counter – –; – – counter; ECA 225 Applied Interactive Programming 25

Operators examples decrement – – var x = 10; counter = 1; total = x + counter – –; // total is 11, counter becomes 0 total = x + – –counter; // total is 10 ECA 225 Applied Interactive Programming 26

Assignment Operators = += -= *= /= %= Assignment Add by value Subtract by value Multiply by value Divide by value Modulus by value ECA 225 Applied Interactive Programming 27

Assignment Operator Examples counter = counter + 1; counter ++; counter += 1; counter += 5; counter = counter * 2; counter *= 10; ECA 225 Applied Interactive Programming 28

Comparison Operators == != > >= < <= Equals Does not equal Greater than or equal to Less than or equal to ECA 225 Applied Interactive Programming 29

Comparison Operators one equal sign means “gets the value of” two equal signs means “equals” name = “Bob” if( name == “Bob” ) ECA 225 Applied Interactive Programming 30

Boolean Operators & & And | | Or ! Not For examples of all operators, visit: http: //www. justustwo. com/ECA 225/lectures/operators. htm ECA 225 Applied Interactive Programming 31

Boolean Operators if( name == “Bob” && age > 40 ) if( name == “Bob” || name == “Carol” ) if( name == “Bob” && !( name == “Carol” ) ) ECA 225 Applied Interactive Programming 32