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

2. 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

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

4. 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”);

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

6. Use on Web Page  Generates code where script is executed in body  Functions can go in head  Wrap with <!-- // code goes here --></script>

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

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

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

10. Logical Values and Operators  Logical Values are truefalse  Usual logical operators !&&|| Short-circuit evaluation

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

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

13. 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

14. 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 fig. 11.6fig. 11.6

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

16. 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]

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

18. 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 fig. 12.6fig. 12.6

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

20. 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 fig. 12.13fig. 12.13

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

22. Final Example  final.html fig. 12.16 fig. 12.16fig. 12.16