WORKING WITH JAVASCRIPT ICONIC REPRESENTATIONS Test your Memory

WORKING WITH JAVASCRIPT

ICONIC REPRESENTATIONS. . . . Test your Memory Objective Queries Need more Info Can you Solve? Coffee Break Brainstorm Recap

• IN THIS LESSON, YOU WILL LEARN: OBJECTIVES • CLIENT SIDE SCRIPTING • FUNCTIONS IN JAVASCRIPT • JAVASCRIPT VALIDATIONS

JAVASCRIPT • INTRODUCTION TO JAVASCRIPT • WHAT IS JAVASCRIPT? • A SCRIPTING LANGUAGE THAT HELPS ADD REAL PROGRAMMING TO YOUR WEB PAGES. • COMMONLY USED AS A CLIENT SIDE SCRIPTING LANGUAGE • LIGHTWEIGHT PROGRAMMING LANGUAGE DEVELOPED BY NETSCAPE • INTERPRETED, NOT COMPILED • DESIGNED TO BE EMBEDDED IN BROWSERS • • • IDEAL FOR ADDING INTERACTIVITY TO HTML PAGES DETECT BROWSER VERSIONS WORK WITH INFO FROM USER VIA HTML FORMS CREATE COOKIES VALIDATE FORM DATA READ AND WRITE HTML ELEMENTS • SUPPORTED BY ALL MAJOR BROWSERS • INTERNET EXPLORER HAS JSCRIPT (STARTED IN IE 3)

JAVASCRIPT • INTRODUCTION TO JAVASCRIPT • USES OF JAVASCRIPT? • USE IT TO ADD MULTIMEDIA ELEMENTS • WITH JAVASCRIPT YOU CAN SHOW, HIDE, CHANGE, RESIZE IMAGES, AND • CREATE IMAGE ROLLOVERS. YOU CAN CREATE SCROLLING TEXT ACROSS THE STATUS BAR. • CREATE PAGES DYNAMICALLY • BASED ON THE USER'S CHOICES, THE DATE, OR OTHER EXTERNAL DATA, JAVASCRIPT • CAN PRODUCE PAGES THAT ARE CUSTOMIZED TO THE USER • INTERACT WITH THE USER • IT CAN DO SOME PROCESSING OF FORMS AND CAN VALIDATE USER INPUT WHEN THE USER SUBMITS THE FORM.

JAVASCRIPT • INTRODUCTION TO JAVASCRIPT • CLIENT SIDE SCRIPTING: • SCRIPT THAT IS EXECUTED AT THE USERS END(CLIENT-SIDE) ON BROWSERS • ENABLES INTERACTION WITHIN A WEBPAGE. • THE CODE REQUIRED TO PROCESS USER-INPUT IS DOWNLOADED AND COMPILED BY THE BROWSER OR PLUG-IN

JAVASCRIPT • INTRODUCTION TO JAVASCRIPT • STEPS FOR PROCESSING A PAGE:

JAVASCRIPT…. BENIFITS • JAVASCRIPT CAN BE USED FOR THE FOLLOWING: • DATA ENTRY VALIDATION. • DYNAMIC HTML INTERACTIVITY. • OFFLOADING A BUSY SERVER. • ADDING LIFE TO OTHERWISE DEAD PAGES. • CREATING WEB PAGES "THAT THINK". • EXTENDED USING AJAX

JAVASCRIPT ……. LIMITATIONS • ACTIONS THAT CANNOT BE PERFORMED USING JAVASCRIPT • SETTING OR RETRIEVING THE BROWSER’S PREFERENCES SETTINGS, MAIN WINDOW APPEARANCE FEATURES, ACTION BUTTONS, AND PRINTING • LAUNCHING AN APPLICATION ON THE CLIENT COMPUTER • READING OR WRITING FILES OR DIRECTORIES ON THE CLIENT COMPUTER • EXTRACTING THE TEXT CONTENT OF HTML PAGES OR THEIR FILES FROM THE SERVER • WRITING FILES TO THE SERVER • READING A SERVER DIRECTORY • CAPTURING LIVE DATA STREAMS FROM THE SERVER • SENDING SECRET E-MAILS FROM WEB SITE VISITORS TO YOU

JAVASCRIPT • JAVASCRIPT BASICS • WRITING A JAVASCRIPT • JAVASCRIPT CODE IS TYPICALLY EMBEDDED IN THE HTML, TO BE INTERPRETED AND RUN BY THE CLIENT'S BROWSER. • SOM IMPORTANT POINTS TO BE NOTED : • JAVASCRIPT CODE IS CASE SENSITIVE • WHITE SPACE BETWEEN WORDS AND TABS ARE IGNORED • LINE BREAKS ARE IGNORED EXCEPT WITHIN A STATEMENT • JAVASCRIPT STATEMENTS END WITH A SEMI- COLON ;

JAVASCRIPT • JAVASCRIPT BASICS • EMBEDDING JAVASCRIPT IN HTML • THERE ARE THREE WAYS TO ADD JAVASCRIPT COMMANDS TO YOUR WEB PAGES. <SCRIPT • EMBEDDING CODE language = "Java. Script"> //statements </SCRIPT> <input type=“submit” on. Click=“……script statements……. ”></input> • INLINE CODE <SCRIPT SRC="filename. js"> </SCRIPT> • EXTERNAL FILE

JAVASCRIPT • JAVASCRIPT BASICS • COMMENTS IN JAVASCRIPT • THE SYNTAX FOR A SINGLE-LINE COMMENT IS: // COMMENT TEXT • THE SYNTAX OF A MULTI-LINE COMMENT IS: /* COMMENT TEXT COVERING SEVERAL LINES */ 12

JAVASCRIPT • JAVASCRIPT BASICS • VARIABLE IN JAVASCRIPT • TO DECLARE VARIABLES, USE THE KEYWORD VAR AND THE VARIABLE var. NAME: x; var name; • A VARIABLE CAN HOLD SEVERAL TYPES OF DATA. • IN JAVASCRIPT YOU DON'T HAVE TO DECLARE A VARIABLE'S DATA TYPE BEFORE USING IT. ANY VARIABLE CAN HOLD ANY JAVASCRIPT DATA TYPE, INCLUDING: • STRING DATA • NUMBERS • BOOLEAN VALUES (T/F)

JAVASCRIPT • JAVASCRIPT BASICS • FUNCTIONS IN JAVASCRIPT • DEFINED WITH THE FUNCTION KEYWORD, FOLLOWED BY THE FUNCTION NAME AND ANY NUMBER OF ARGUMENTS. • DEFINED WITHIN THE HEAD SECTION OF THE WEBPAGE. • SYNTAX: function. Name(argument){ //statements } • A VARIABLE CAN HOLD SEVERAL TYPES OF DATA. • IN JAVASCRIPT YOU DON'T HAVE TO DECLARE A VARIABLE'S DATA TYPE BEFORE USING IT. ANY VARIABLE CAN HOLD ANY JAVASCRIPT DATA TYPE, INCLUDING: • STRING DATA • NUMBERS • BOOLEAN VALUES (T/F)

• YOUR FIRST SCRIPT <HTML> JAVASCRIPT (CONTD. . ) <HEAD> <TITLE>MY FIRST SCRIPT</TITLE> </HEAD> <BODY> <H 1>LET'S SCRIPT. . . </H 1> <HR> <SCRIPT LANGUAGE="JAVASCRIPT"> <!-- HIDE FROM OLD BROWSERS DOCUMENT. WRITE("THIS BROWSER IS VERSION " + NAVIGATOR. APPVERSION) DOCUMENT. WRITE(" OF <B>" + NAVIGATOR. APPNAME + "</B>. ") // END SCRIPT HIDING --> >

SCRIPTS IN THE <HEAD> USING THE <SCRIPT> TAG <HTML> <HEAD> <TITLE>A DOCUMENT</TITLE> <SCRIPT LANGUAGE="JAVASCRIPT"> // STATEMENTS </SCRIPT> Scripts in the <BODY> </HEAD> <HTML> <BODY> <HEAD> </BODY> <TITLE>A Document</TITLE> </HEAD> </HTML> <BODY> <SCRIPT LANGUAGE="Java. Script"> // statements </SCRIPT> </BODY> </HTML>

• INCLUDING JAVASCRIPT CODE IN AN HTML DOCUMENT USING THE <SCRIPT> TAG’S SRC ATTRIBUTE <HTML> <SCRIPT LANGUAGE= “JAVASCRIPT” SRC= “C: FILE 1. JS”> </SCRIPT> </HTML> CONTENTS OF THE FILE ‘C: FILE 1. JS’ Contains the Java. Script statements that will be executed when the Script is run. DOCUMENT. WRITE(“<H 3>THIS IS SEPARATE. JS FILE”) ALERT(“THIS FILE IS INCLUDED USING SRC DOCUMENT. BGCOLOR= “YELLOW” ATTRIBUTED OF <SCRIPT> TAG”)

ACCEPTING USER INPUT • PROMPT() METHOD OF THE WINDOW OBJECT prompt string SYNTAX: <VARIABLENAME> = PROMPT(MSGSTR, DEFVAL) • DISPLAYS A SMALL WINDOW WITH A TEXT FIELD • TAKES USER INPUT IN THE FORM OF A STRING • EXAMPLE <SCRIPT LANGUAGE= “JAVASCRIPT”> S=PROMPT(“ENTER YOUR MESSAGE”, “MESSAGE”); DOCUMENT. WRITE(S ); > default value for the text field

VARIABLES AND VALUES • JAVASCRIPT DOES NOT HAVE ANY EXPLICIT DATA TYPES. • THE VALUE OF EACH VARIABLE DEPENDS ON THE CONTEXT IN WHICH IT IS USED. • ALL JAVASCRIPT VARIABLES ARE DECLARED USING THE KEYWORD, VAR. • A VARIABLE MAY ALSO BE INITIALIZED AT THE TIME OF DECLARATION. • MULTIPLE VARIABLES CAN BE DECLARED ON THE SAME LINE BY SEPARATING THEIR NAMES WITH COMMAS. • EXAMPLE: VAR X = 10 VAR Y, Z = “ 200” VAR K = “TEST”, J= “JAVASCRIPT”

<HTML> <HEAD> <PRE> <TITLE>EXAMPLE OF A FUNCTION</TITLE> <SCRIPT LANGUAGE = “JAVASCRIPT”> FUNCTIONS B O D Y VAR X = 0 FUNCTION SUMMATION(ENDVAL) { VAR THESUM = 0 FOR (VAR I = 1; I <= ENDVAL; I++) { THESUM += I } RETURN(THESUM) Function Name Parameter(s)

• EVENTS OCCUR IN RESPONSE TO SOME USER ACTION. EVENT HANDLING • E. G CLICK ON A BUTTON, CHANGING THE SELECTED ITEM IN A SELECT • AFTER AN OCCURRENCE OF THE EVENT, IT’S PROPERTIES ARE SET & THEN IT IS DELEGATED TO THE TARGET. • TARGET CAN BE A JAVA SCRIPT FUNCTION • E. G <INPUT TYPE=“BUTTON” ONCLICK=“VALIDATE()”> • WE CAN ALSO ASSIGN OUR OWN FUNCTION TO JAVA SCRIPT EVENT • MYFORM. MYBUTTON. ONCLICK = ISNUMBER • THIS WILL INVOKE ISNUMBER FUNCTION WHEN USER CLICKS ON MYBUTTON.

TYPES OF EVENTS • KEYBOARD RELATED EVENTS • • MOUSE CLICK EVENTS • • ONDRAGDROP WINDOW MODIFICATION EVENTS • • ONMOUSEDOWN, ONMOUSEUP DRAG DROP EVENTS • • ONKEYPRESS, ONKEYUP ONMOVE, ONRESIZE LIST OF EVENTS FOR WINDOW OBJECT • ONBLUR, ONFOCUS, • ONLOAD, ONUNLOAD, • ONMOVE, ONRESIZE, ONDRAGDROP

EVENT OBJECT IN JAVA SCRIPT • EVENT OBJECT IN JAVA SCRIPT CAPTURES THE USER EVENTS • IT PACKAGES ALL PROPERTIES & METHODS TO MANIPULATE THE EVENT ATTRIBUTES • SOME IMPORTANT PROPERTIES • MODIFIERS, PAGEX, PAGEY, TARGET, TYPE • ACCESING PROPERTIES • EVENTOBJECT. PROPERTY • EXAMPLE CODE BELOW PRINTS THE TYPE OF EVENT • <INPUT TYPE="BUTTON" NAME="MYBUTTON" VALUE="CLICK" ONKEYPRESS="MYFUN(EVENT)"> • ON KEY PRESS MYFUN() WILL BE CALLED • FUNCTION MYFUN(EVT) { THE EVENT } // PRINT THE TYPE OF ALERT("EVENT TYPE "+EVT. TYPE); • OUTPUT -> EVENT TYPE KEYPRESS

ASSOCIATING EVENTS WITH FUNCTIONS • MOST OF THE COMMUNICATION FROM USER ACTION TO JAVA SCRIPT HAPPENS THROUGH EVENTS • WE CAN ASSOCIATE PARTICULAR EVENT WITH A JAVA SCRIPT FUNCTION, WHICH DOES SOME CUSTOM PROCESSING ON THE OCCURRENCE OF THE EVENT • WE CAN ALSO PASS SOME PARAMETERS TO THAT METHOD • WE CAN ALSO CALL MORE THAN ONE FUNCTION AT THE HAPPENING OF THE EVENT AS SHOWN BELOW • <INPUT TYPE=“BUTTON” ONCLICK=“CHECKLOGIN(); CHECKPWD() > • HERE ON CLICK OF BUTTON FIRST CHECKLOGIN WILL BE CALLED FOLLOWED BY CHECKPWD.

• FUNCTIONS ARE USED TO PROVIDE A UNIFORM METHOD FOR ORGANIZING CODE. OBJECTS • OBJECTS SERVE THE SAME PURPOSE FOR DATA. • DATA ITEMS LIKE SIMPLE VARIABLES ARE TYPE-LESS QUANTITIES CAN ONLY HOLD A SINGLE VALUE OF SOME SORT AT A TIME. • OBJECTS PROVIDE THE ABILITY TO HOLD MULTIPLE VALUES, SO THAT A GROUP OF RELATED DATA ELEMENTS COULD BE ASSOCIATED WITH ONE ANOTHER. • TWO ASPECTS TO JAVASCRIPT OBJECTS • CREATING THEM • USING THEM. • WHAT JAVASCRIPT CALLS AN OBJECT IS CALLED A DATA STRUCTURE (OR CLASS) IN MANY OTHER LANGUAGES.

OBJECTS (CONTD. . ) • A JAVASCRIPT CAPABLE BROWSER WILL PROVIDE A NUMBER OF BUILT–IN OBJECTS. • OBJECT-ORIENTED PROGRAMMING IS A STYLE OF PROGRAMMING IN WHICH RELATED CONCEPTS ARE GROUPED TOGETHER. • IF YOU HAVE FIVE DATA ELEMENTS AND THREE FUNCTIONS THAT MANIPULATE THOSE ELEMENTS, THEN YOU GROUP THOSE ELEMENTS AND FUNCTIONS TOGETHER INTO A GENERIC CONTAINER KNOWN AS AN OBJECT. • THIS IS THE COMMON GROUND SHARED BY (ALMOST) ALL OBJECT-ORIENTED PROGRAMMING LANGUAGES. • DIFFERENCES ARISE IN THE DETAILS OF HOW SUCH CONTAINERS ARE ORGANIZED, AND IN HOW THEIR CONTENTS CAN BE ACCESSED AND MODIFIED. • IT IS USEFUL TO KEEP FUNCTIONS THAT MANIPULATE DATA ITEMS IN A SPECIFIC WAY WITH THOSE DATA ITEMS THEMSELVES.

OBJECTS (CONTD. . ) • THESE FUNCTIONS ARE KNOWN AS THE METHODS OF AN OBJECT. • OBJECTS COLLECT RELATED DATA ITEMS IN A SINGLE PLACE AND MAKE IT SIMPLER TO ACCESS THOSE ITEMS. • JAVASCRIPT REFERS TO THE ITEMS COLLECTED WITHIN AN OBJECT AS ITS PROPERTIES. • JAVASCRIPT OBJECTS NOT ONLY STORE DATA, THEY ALSO STORE FUNCTIONS.

OBJECTS (CONTD. . ) • EXAMPLE • THE JAVASCRIPT DATE OBJECT USED TO STORE A DATE, AND ALSO A TIME. • THE DATE OBJECT HAS A VERY PARTICULAR SET OF METHODS THAT ARE USEFUL IN CONVERTING STRING REPRESENTATIONS OF DATES IN DATE OBJECTS. • WHILE THESE FUNCTIONS ARE IMPORTANT WHEN MANIPULATING STRINGS SUCH AS “NOV 23, 1990, ” THEY DO NOT REALLY HAVE SWEEPING APPLICATION ELSEWHERE. IN OTHER WORDS, THEY ARE DATE-SPECIFIC. • IT MAKES GOOD SENSE TO KEEP THESE METHODS WITH DATE OBJECTS, RATHER THAN MAKING THEM GENERALLY AVAILABLE FUNCTIONS.

OBJECTS (CONTD. . ) • A CONCEPT OF EQUAL IMPORTANCE IS THAT OF THE INSTANCE. • THE RELATIONSHIP BETWEEN AN OBJECT AND AN INSTANCE OF AN OBJECT IS THE SAME AS THE RELATIONSHIP BETWEEN A DATA TYPE AND A VARIABLE OF THAT DATA TYPE. • IN THE TYPE-LESS LANGUAGE, SUCH AS JAVASCRIPT, THIS DISTINCTION IS BLURRED BUT IS STILL PRESENT. • WHILE THE OBJECT, DATE, IS AN ABSTRACT THING THAT DOES REFER TO ANY SPECIFIC DATE, AN INSTANCE OF THE DATE OBJECT MUST REFER TO SOME SPECIFIC DATE. • IT’S PROPERTIES, WHICH SPECIFY THE ACTUAL DAY, MONTH, YEAR, AND SO FOURTH, HAVE ALL BEEN ASSIGNED SPECIFIC VALUES.

• CREATING CUSTOM JAVASCRIPT OBJECTS • TO CREATE A JAVASCRIPT OBJECT, YOU SHOULD CREATE A CONSTRUCTOR. • A CONSTRUCTOR IS A SPECIAL JAVASCRIPT FUNCTION THAT DEFINES WHAT THE OBJECT WILL LOOK LIKE AND HOW IT WILL ACT. • THE CONSTRUCTOR DOES NOT ACTUALLY CREATE THE OBJECT BUT PROVIDES A TEMPLATE FOR WHAT AN INSTANTIATED OBJECT WILL LOOK LIKE. • SYNTAX OF A CONSTRUCTOR FUNCTION OBJECT (PARAMETER 1, PARAMETER 2, . . . ) { THIS. PROPERTY 1 = PARAMETER 1 THIS. PROPERTY 2 = PARAMETER 2 THIS. METHOD 1 = FUNCTION 1 THIS. METHOD 2 = FUNCTION 2 }

JAVASCRIPT OBJECTS (CONTD. . ) • CREATING CUSTOM JAVASCRIPT OBJECTS (CONTD. . ) • THE NEW OPERATOR IS USED FOR INSTANTIATING OBJECTS • SYNTAX VAR OBJECTINSTANCE = NEW OBJECTTYPE PARAM 2, …) • EXAMPLE FUNCTION HOUSE(RMS, STL, YR, GARP) { THIS. ROOMS = RMS; THIS. STYLEL = STL; THIS. YEARBUILT = YR; THIS. HASGARAGE = GARP; } : VAR H = NEW HOUSE(3, "COLONIAL", 1999, "YES") (PARAM 1,

• THE FOR. . . IN CONSTRUCT JAVASCRIPT OBJECTS (CONTD. . ) • USED TO CHECK WHETHER THEY HAVE PROPERTIES OR NOT. • ONE ITERATION IS USED FOR EACH PROPERTY • THE LOOP IS NOT EXECUTED IF THE OBJECT DOESN’T HAVE ANY PROPERTIES. • SYNTAX FOR(VARNAME IN OBJNAME) Name of a variable that takes on { …. . . } the successive property names of the object objname. • THE FOR…IN LOOP WORKS FOR CUSTOMIZED JAVASCRIPT OBJECTS ALSO. • THIS FORM OF THE FOR STATEMENT ALSO PERMITS THE VARNAME TO CONTAIN A VAR DECLARATION.

• THE FOR. . . IN CONSTRUCT (CONTD. . ) • EXAMPLE JAVASCRIPT OBJECTS (CONTD. . ) • TO DISPLAY ALL THE PROPERTIES OF THE DOCUMENT OBJECT. <HTML> <HEAD><TITLE>EXAMPLE OF THE FOR…IN LOOP</TITLE> </HEAD> <BODY> <PRE> <SCRIPT LANGUAGE = “JAVASCRIPT”> VAR ANOBJ=DOCUMENT FOR(VAR PROPNAME IN ANOBJ) { DOCUMENT. WRITELN(PROPNAME) } </SCRIPT></PRE> </BODY> </HTML>

JAVASCRIPT OBJECTS (CONTD. . ) • WITH STATEMENT • USED TO AVOID REPEATEDLY SPECIFYING THE OBJECT PREFIX WHEN ACCESSING PROPERTIES OR METHODS OF AN OBJECT. objname is the name of an object or instance. • SYNTAX WITH(OBJNAME) { ……. . . } • REFERENCE TO PROPERTIES OF OBJNAME INSIDE THE WITH BLOCK OCCURS AS IF THEY HAD BEEN PREFIXED WITH OBJNAME AND THE DOT OPERATOR (. ).

• WITH STATEMENT JAVASCRIPT OBJECTS (CONTD. . ) • EXAMPLE • TO ILLUSTRATE THE WRITELN(), WRITE() AND ALERT() METHODS AND THE TITLE PROPERTY OF DOCUMENT OBJECT USING THE WITH STATEMENT. <HTML> <HEAD> <TITLE>EXAMPLE FOR WITH STATEMENT</TITLE> <PRE> <SCRIPT LANGUAGE = “JAVASCRIPT”> WITH (DOCUMENT) { WRITELN(“ 1. TESTING THE ‘WITH’ STATEMENT”) WRITE(“ 2. TESTING THE ‘WITH’ STATEMENT”) WRITELN(“ 3. TESTING THE ‘WITH’ STATEMENT”) TITLE= “THIS IS DOCUMENT TITLE” ALERT(“THIS IS ALERT”) } </SCRIPT> </PRE> </HEAD></HTML>

ARRAYS • ARRAYS ARE COLLECTION OF HOMOGENOUS ELEMENTS • VAR MYARR = NEW ARRAY{3, 2, 3, 4} • THE NUMBER OF ELEMENTS IN ARRAY CAN BE FOUND OUT BY “LENGTH” PROPERTY. • MULTI-DIMENSIONAL ARRAYS CAN BE CREATED IN JAVA SCRIPT AS FOLLOWS • A = NEW ARRAY(4), • FOR( VAR I = 0; I <4 ; I++) { • A[I] = NEW ARRAY(4) ; • FOR (VAR J = 0; J <4 ; J++) • } { A[I][J] = 10; }

ERROR HANDLING • THE ERROR EVENT WAS INTRODUCED IN JAVASCRIPT 1. 1 TO PROVIDE THE CAPABILITY TO HANDLE ERRORS ASSOCIATED WITH THE LOADING OF IMAGES OR DOCUMENTS. • THE ONERROR EVENT HANDLER OF THE IMAGE OBJECT IS USED TO HANDLE IMAGE-RELATED LOADING ERRORS. • THE ONERROR EVENT HANDLER OF THE WINDOW OBJECT IS USED TO HANDLE ERRORS THAT OCCUR DURING THE LOADING AND PROCESSING (SYNTAX AND RUNTIME ERRORS) OF A DOCUMENT.

HANDLING ERRORS BY USING TRY, THROW AND CATCH STATEMENTS • SCRIPTS ARE PRONE TO ERRORS AND EXCEPTIONS. TO HANDLE ERRORS AND EXCEPTIONS IN THE CODE, THE TRY, THROW AND CATCH STATEMENTS ARE USED. • AN EXCEPTION IS AN ERROR THAT IS GENERATED BY THE SCRIPT DURING EXECUTION. USERS CAN GENERATE AN EXCEPTION BY THROWING IT. • THE CODE THAT HANDLES EXCEPTIONS THROWN BY THE SCRIPT IS KNOWN AS AN EXCEPTION HANDLERS ARE SAID TO CATCH EXCEPTIONS.

HANDLING ERRORS BY USING TRY, THROW AND CATCH Normal script flow of control STATEMENTS (CONTD. . ) If an error is detected an exception is thrown The throw statement is used to throw an exception. The exception is caught and handled by an exception handler

HANDLING ERRORS BY USING TRY, THROW AND CATCH STATEMENTS (CONTD. . ) • SYNTAX: THROW EXPRESSION • THE EXPRESSION INFORMS US ABOUT THE TYPE OF ERROR THAT HAS OCCURRED. FOR EXAMPLE, THE FOLLOWING STATEMENT THROWS AN EXCEPTION NAMED INVALIDINPUT: THROW “INVALID INPUT” • THROWING STRING VALUES MAKES THE CODE EASIER TO UNDERSTAND DEBUG. • THE TRY AND CATCH STATEMENTS WORK TOGETHER TO SUPPORT EXCEPTIONHANDLING.

HANDLING ERRORS BY USING TRY, THROW AND CATCH STATEMENTS (CONTD. . ) • SYNTAX TRY { STATEMENTS WHERE AN EXCEPTION MAY BE } CATCH(ERRORVARIABLE) STATEMENTS THAT HANDLE THE EXCEPTION } THROWN

HANDLING ERRORS BY USING TRY, THROW AND CATCH STATEMENTS (CONTD. . ) • THE TRY BLOCK CONTAINS THE STATEMENTS FOR WHICH EXCEPTIONS MAY ARISE AND WHEN AN EXCEPTION ARISES, THE THROW STATEMENT SHOULD BE USED TO THROW THE EXCEPTION. • A CATCH STATEMENT IMMEDIATELY FOLLOWS THE TRY BLOCK AND PERFORMS THE EXCEPTION-HANDLING. • THE ERRORVARIABLE IS USED TO REFERENCE ANY EXCEPTION THAT OCCURS. IT IS ASSIGNED AN INSTANCE OF THE ERROR OBJECT.

HANDLING ERRORS BY USING TRY, THROW AND CATCH STATEMENTS (CONTD. . ) • IF AN EXCEPTION IS THROWN DURING THE PROCESSING OF THE STATEMENTS CONTAINED WITHIN THE TRY STATEMENT, THEN THE ERRORVARIABLE IS ASSIGNED AN ERROR OBJECT THAT IDENTIFIES THE EXCEPTION, AND CONTROL IMMEDIATELY TRANSFERS TO THE STATEMENTS CONTAINED WITHIN THE CATCH STATEMENT. • IF NO EXCEPTION IS THROWN DURING THE PROCESSING OF THE STATEMENTS CONTAINED WITHIN THE TRY STATEMENT, THEN THE CATCH STATEMENT IS SKIPPED, AND CONTROL TRANSFERS TO THE STATEMENT FOLLOWING THE CATCH STATEMENT.

• NESTED TRY STATEMENTS AND RETHROWING EXCEPTIONS YOU CAN IMPLEMENT MULTIPLE LEVELS OF EXCEPTION-HANDLING, TRY STATEMENTS CAN BE NESTED WITHIN ANOTHER TRY STATEMENTS. IT CAN BE WRITTEN AS: TRY //HIGHER-LEVEL { TRY //LOWER-LEVEL {. . . } CATCH(LOWER) //LOWER-LEVEL {. . . } } CATCH(HIGHER) //HIGHER-LEVEL {. . . } Slide 44

STRING OBJECT • STRING REPRESENTS A SERIES OF CHARACTERS • STRING OBJECT IN JAVA SCRIPT HAS MANY STRING UTILITY FUNCTIONS • S 1 = “HELLO” // CREATES A STRING LITERAL • S 1 = NEW STRING(“HELLO”); // CREATES A STRING OBJECT • SOME USEFUL METHODS • S 1 = NEW STRING(“TEAM”) • S 2 = NEW STRING(“WORKFORCE”) • S 1. CHARAT(2) --> ‘A’ • S 1. INDEXOF(‘M’) --> 3 • S 2. LASTINDEXOF(‘O’) --> 5 • S 1. CONCAT(S 2) --> “TEAMWORKFORCE” • S 1. TOUPPERCASE()--> TEAM • S 2. SUBSTRING(4) -->FORCE Slide 45

STRING OBJECT • STRING APPEARANCE METHODS. • IT IS USED TO CONTROL HOW A STRING APPEARS WHEN DISPLAYED ON A WEB PAGE. Slide 46 JSCRTRAN Ver 1. 1. 0 17/01/02 • S 1. BLINK() • S 1. BIG() • S 1. SMALL() • S 1, FONTCOLOR(“COLOR”) • S 1. FONTSIZE(“SIZE”) • S 1. BOLD() • S 1. ITALICS() • S 1. STRIKE() • S 1. SUB() • S 1. SUP() • S 1. ANCHOR(“ANCHORSTRING”) • S 1. LINK(“LINKSTRING”)

MATH OBJECT • MATH OBJECT OF JAVA SCRIPT HAS FUNCTIONS FOR ALL THE MATHEMATICAL OPERATIONS • ABS(), FLOOR(), ROUND(), RANDOM() • SQRT(), POW(), EXP() • COS(), ACOS(), SIN(), ATAN()

DATE OBJECT • DATE IS A UTILITY OBJECT PROVIDED FOR ALL THE DATE RELATED FUNCTIONS • NEW DATE() - RETURNS THE CURRENT DATE & TIME • DATE OBJECT HAS FOLLOWING CONSTRUCTORS • • DATE(MILLISECONDS) • DATE(YY, MM, DD) • DATE(DATESTRING) • NEW DATE(“JAN 20, 2002 08: 34: 20”) DATE OBJECT HAS METHODS TO GET/SET ALL THE COMPONENTS LIKE YEAR, MONTH, DAY • GETDAY() -->RETURNS DAY WITHIN WEEK(0 -6) • GETHOURS()-->RETURNS HOUR WITHIN DAY(0 -23) • GETMONTH()-->RETURNS MONTH (0 -11) • GETFULLYEAR()-->RETURNS THE FULL YEAR • SETMONTH(VALUE)-->SETS THE MONTH (0 -11) • SETHOURS(VALUE)-->SETS THE HOUR (0 -23)

THE IMAGE OBJECT • THE IMAGE OBJECT RESIDES BENEATH THE DOCUMENT OBJECT IN THE JAVASCRIPT HIERARCHY. THIS OBJECT ALLOWS YOU TO MANIPULATE IMAGES IN INTERNET EXPLORER 4. 0 AND NETSCAPE NAVIGATOR 3. 0 AND UPWARD • ONE OF THE MOST POPULAR USES OF THE IMAGE OBJECT IS TO CREATE BUTTONS THAT ANIMATE WHENEVER A MOUSE PASSES OVER IT. THIS IS ACCOMPLISHED BY USING THE IMAGE OBJECT AND CALLING THE ARRAY NUMBER OF THE IMAGE. REMEMBER THAT WHEN YOU USE THE ARRAY OFFERED BY THE IMAGE OBJECT, THE NAME OF THE ARRAY IS IMAGES, NOT IMAGE. THE SAME APPLIES TO THE FRAME OBJECT ARRAY (WHICH WOULD THEREFORE BE FRAMES), AND THE FORM OBJECT ARRAY (WHICH WOULD THEREFORE BE FORMS).

THE IMAGE OBJECT (CONTD. . ) • IF YOU HAVE AN HTML DOCUMENT WITH ANY IMAGES IN IT, THEN YOU CAN ACCESS THE IMAGE THROUGH ITS ARRAY NUMBER USING THE IMAGE OBJECT. THE STANDARD SYNTAX TO USE THE IMAGES ARRAY IS AS FOLLOWS: DOCUMENT. IMAGES[0]. SRC = NEWIMAGE. JPG • THE ABOVE STATEMENT WOULD TAKE THE DEFAULT IMAGE, WHICH IS ALSO THE FIRST IMAGE MENTIONED IN THE HTML FILE, AND REPLACE IT WITH NEWIMAGE. JPG • THE FOLLOWING CODE WOULD REPLACE THE ORIGINAL IMAGE WITH THE IMAGE WHOSE NUMBER IS REFERENCED BY THE ARRAY NUMBER: ONCLICK=“DOCUMENT. IMAGES[0]. SRC = ‘. . /DOCS/IMAGES/ROUTER. GIF’”

THE IMAGE OBJECT (CONTD. . ) • IMAGE OBJECT METHODS • THE IMAGE OBJECT HAS NO BUILT-IN METHODS • IMAGE OBJECT EVENTS • IN ADDITION TO LINK EVENTS SUCH AS ONCLICK, ONMOUSEOUT, AND ONMOUSEOVER, THE IMAGE OBJECT HAS THREE EVENT HANDLERS ASSOCIATED WITH IT. THESE ARE ONLOAD, ONERROR, AND ONABORT. THESE EVENTS HELP YOU SCRIPT ALTERNATIVES IN CASE A USER TURNED OFF INLINE IMAGES IN HIS BROWSER OR A NETWORK ERROR OCCURS. • ALTHOUGH NETSCAPE NAVIGATOR 3. 0 SUPPORTS THE IMAGE OBJECT, INTERNET EXPLORER 3. 0 DOES NOT. BOTH NAVIGATOR AND INTERNET EXPLORER 4. 0, SUPPORT THE IMAGE OBJECT, BUT YOU SHOULD REMEMBER TO MAKE YOU CODE AS BACKWARD COMPATIBLE AS POSSIBLE. IF YOU CHOOSE NOT TO, BE SURE TO PROVIDE ALTERNATIVE MEANS OF NAVIGATION.

QUERIES

SUMMARY • IN THIS LESSON, YOU HAVE LEARNT: • JAVA SCRIPT LANGUAGE FUNDAMENTAL • JAVA SCRIPT BUILT-IN FUNCTIONS