Lập trình Java script tự học

JavaScript

1


Content
•
•
•
•
•
•
•

1. Introduction
2. Syntax
3. Variables and Operators
4. JavaScript Operators
5. Conditional statements
6. For loops
7. While loops
2


Content
•
•
•
•
•
•

•

8. Alert, Confirm and Prompt
9. Functions 1
10. Functions 2
11. Strings
12. Arrays
13. Associative Arrays
14. References
3


1. Introduction
• First developed by Netscape
• Ease traffic between server and client
• Ten fundamental aspects:
–
–
–
–
–
–
–
–
–
–

Can be included in HTML
Dependent on the environment
Interpreted language

Flexible language
Based on objects
Event driven
Is not Java
Many-functionally
Is evolving
Covers diverse context
4


2. Syntax
• Adding JavaScript in an HTML page
• Hiding code in old browsers
• Syntax conventions

5


2.1 Adding JavaScript in an HTML page
• Use “<script>” and “</script>”
• JavaScript code can be added:
– In HTML file
– In an external .js file

6


2.1 Adding JavaScript in an HTML page

Figure 1: JavaScript written within web page

7


2.1 Adding JavaScript in an HTML page

Figure 2: JavaScript written in an external file
8


2.2 Hiding code in old browsers
• Avoid the appearance of JS code on web page
• To hide code, use “<!-- and “-->”
• Example:
<script type="text/javascript">code block
--></script>

9


2.3 Syntax conventions
•
•
•
•
•
•
•

Case-sensitive

Semicolon (;)
Blank spaces
Quotes
Special Characters
Comments
The name of the variables and functions
10


2.3.1 Case-sensitive
• Makes distinction between large and small
letters
• Example:
– examples and Examples will be treated differently

11


2.3.2 Semicolon
• All line statements must end with a “;”
• Example:
– var1 = 3;
– var2 = 8;

12


2.3.3 Blank spaces
• JS ignores blank spaces in instructions
• Example:

var=1;
is the same as
var =
1;

13


2.3.4 Quotes
• Used to delimit strings
• Example:
– ‘I learn JavaScript’
– “I learn JavaScript”

14


2.3.5 Special Characters
•
•
•
•

\b
\r
\’
Example:

\f
\t

\”

\n
\\

To display text: “JavaScript” Course \
Use syntax:
document.write ("\" JavaScript \" Course \\")

15


2.3.6 Comments
• To specify role of variables, instructions
• To add comment on a single line, use: //
– Example: //Comment on a single line

• To add comments on multiple lines, use
– /* and */
– Example:
/* comment on ...
multiple lines
... */
16


2.3.7 The name of the variables and functions

• First character must be:
– A letter

– An underscore
– A $ sign

• First character can not be a number
• Name should not contain blank space
• Do not use reserved words

17


3. Variables and Operators
• Using variables
• Operators

18


3.1 Using variables
• Used to store data
• Variable Types:
– No fixed types of data
– Examples:
var x = "xyz";
x = 8;

• Life spam of a variable:
– Local
– Global
19

3.2 Operators
• Definition:
– Are symbols determining how data are modified
– Used to work with data, change variable’s value

• Operator kinds:
– Binary
– Unary

• Operator types:
Arithmetic Assigning
Comparison
Logical
Strings Operators
Conditional Functions Operators
Objects Operators

Logical
Typeof

20


4. JavaScript Operators
•
•
•
•
•

•
•

Arithmetic operators
Comparison operators
Strings operators
Functions operators
Objects operators
Conditional operators
Operators precedence

Assigning operators
Logical operators
Typeof operators

21


4.1 Arithmetic operators
• “=“:
– used to assign values
– Example: x = 8;

• “+“:
– used to add values
– Example: x = 7+8;

• “-“:
– subtraction
– Example: x = 7-8;

22


4.1 Arithmetic operators
• “*“:
– multiplication
– Example: x = 7*8;

• “/“:
– division
– Example: x = 7/8;

• “%“:
– modulo
– Example: x = 8%3;
23


4.1 Arithmetic operators
• “++“:
– increment
– Example: x++;

• “--“:
– decrement
– Example: x--;

24

4.2 Assigning operators

Table 1: Assigning operators

25