1. JavaScript: A short introduction Joseph Lee Email: joseph.lee@hkuspace.hku.hk Created by Joseph Lee

2. 2 Introduction an interpreted programming language object-oriented capabilities scripts embedded in HTML documents not Java simplified not simple :-(

3. Created by Joseph Lee3 Example: Executable Content JavaScript for (i=1; i<=9; i++) document.write("2 * ", i, " = ", 2*i, " ")

4. Created by Joseph Lee4 JavaScript Can Control Document Appearance and Content Control the Browser Interact with Document Content Interact with the User Read and Write Client State with Cookies Interact with Applets Manipulate Embedded Images and more …

5. Created by Joseph Lee5 JavaScript Can’t lack of graphics capabilities, does not allow the reading or writing of files for security reasons does not support networking does not have any multithreading capabilities

6. Created by Joseph Lee6 Variables a name associated with a data value to store and manipulate data in our programs, e.g., i = 3; sum = i + 4; declaration is not necessary, but recommended using the var keyword, e.g., var i = 3; var sum;

7. Created by Joseph Lee7 JavaScript is untyped! In Java, int i; boolean checked; In JavaScript, var i; var checked;

8. Created by Joseph Lee8 Untyped? variables can hold values of any data type, e.g, i = 20; i = "Hello world." values are conveniently and automatically converted from one type to another, e.g., i = "20"; sum = 7 + i;

9. Created by Joseph Lee9 Strings a string of letters, digits, punctuation characters, and so on data type for representing text string literals may be included in your programs by enclosing them in matching pairs of single (' ' ) or double quotes (" ")

10. Created by Joseph Lee10 Strings Operations concatenation msg = "hello" + "world"; length of a string msg.length to extract a character from a string msg.charAt(0) // the first character msg.charAt(msg.length-1) // the last char to extract part of a string msg.substring(0, 5) // a 5-char string starting at index 0

11. Created by Joseph Lee11 JavaScript Object Model Basic terminology: –objects state (data) -> instance variable (property) message -> method –classes –inheritance –polymorphism

12. Created by Joseph Lee12 Objects and Properties msg.length name of object name of property dot needed to access a property

13. Created by Joseph Lee13 Objects and Methods document.write("Hello world") name of object name of method dot needed to access a method argument(s) included in parentheses

14. Created by Joseph Lee14 Example 1: Alert box window.alert("Hello World")

15. Created by Joseph Lee15 Example 2: Read/Set Properties document.bgColor = "yellow" window.alert(document.bgColor)

16. Created by Joseph Lee16 Example 3: Prompt var username = window.prompt("What is your name?", "") document.write(" Hello ", username, " ")

17. Created by Joseph Lee17 Adding Comments <!-- Old browsers will ignore the script // username holds the name input by user var username = window.prompt("What is your name?", "") // display a greeting message document.write(" Hello ", username, " ") // -- > HTML comments JavaScript comments

18. Created by Joseph Lee18 Mixing JavaScript and HTML Today is : document.write(new Date()) This page was modified on: document.write(document.lastModified)