COP 3813 Intro to Internet Computing

COP 3813Intro to Internet Computing Prof. Roy Levow Lecture 4 JavaScript

JavaScript • JavaScript • Object-oriented programming language • Interpreted from source code • Supported by most browsers • Executed on client system in browser • Program text output is treated as html and rendered by browser • Includes extensive support for generating web page and window elements

Variables and Assignment • Variable names essentially as in C++ • No type in declaration var name1, name2, …; • Assignment operator =

Expressions • Very similar to C++ • Arithmetic Operators: + - * / % ++ -- etc. as in C++ • Comparison operators: < <= == … • String concatenation with + • also converts other values to string if possible • Output with document.writeln( str ); • Input with val = window.prompt(“msg”);

Basic Control Structures • if (cond) stmt else // optional else part stmt • { … } // block • while (cond) stmt • for (init; test; incr) stmt

Use on Web Page • Generates code where script is executed in body • Functions can go in head • Wrap with <script type = “text/javascript”>  </script>

Examples • Class Average 2 (fig. 8.9) • Analysis (fig. 8.11) • Interest Table (fig. 9.6)

More Control Statements • switch (choice) { case val: stmt break; … default: // optional stmt } • do stmt while (cond);

Examples • Bullet lists with switch (fig. 9.7) • Headings with do-while (fig. 9.9)

Logical Values and Operators • Logical Values are true false • Usual logical operators ! && || Short-circuit evaluation

Defining Functions • function fname(parm1, parm2, …) { //code return expr; } • Notes • No return type • expr in return omitted if no return value

Example • Table of Random Numbers (fig. 10.4) • Note use of functions from class Math • Die Roll (fig. 10.5) • Craps (fig. 10.6)

Arrays • Array is a class • Declare array with var list = new Array(size); • Access with list[index]; • Start with 0 • Can hold any type of value • Deallocation is automatic when another value is assigned to variable • list.length returns length

Arrays Initialization • In constructor new Array(“red”, “green”, “blue”); • By array object x = [1, 2, 3, 4]; • Can have undefined values; never assigned • Example: DieRoll, fig. 11.6

Reference Parameters • Arrays and objects are passed by reference so a change in the function changes the calling value • Scalars are passed by value

Two-dimensional Arrays • Declare an Array for rows • Then assign an Array to each element • Does not enforce rectangular form • Access with Array[i][j]

Objects • Similar to C++ • Declared with new • Math object has elements that are standard math functions Math.sin(x)

Strings • Class String supports character strings • Constants are surrounded by “ “ • Can use usual C++ \ escaped • Has many methods for string manipulation • Operator + for concatenation • Example: SplitAndSubString.html fig. 12.6

Date Object • Access and format date and time • See definitions at W3Schools • Example: DateTime.html fig. 12.9

Document and Window Objects • Document object allows access to all components of a document • See definitions at W3Schools • Window object allows control of window features • See definitions at W3Schools • Example: Window.html fig. 12.13

Cookies • Accessed through Document cookie property • Example: cookie.html fig. 12.15

Final Example • final.html fig. 12.16

COP 3813 Intro to Internet Computing