Bài giảng Javascript - Chương 1 - Trương Diệu Linh

1 
Javascript 
Giáo viên: TS. Trương Diệu Linh 
	 Bộ môn Truyền thông & Mạng 
	 linhtd@it-hut.edu.vn 
Bài giảng: www.iro.umontreal.ca/~truongtd/courses/web.htm 
2 
Nội dung 
Giới thiệu về Javascript 
Đưa Javascript vào trong HTML 
Kiểu dữ liệu và biến 
Các toán tử 
Các cấu trúc điều khiển 
Hàm trong Javascript 
Các sự kiện trong HTML 
Các đối tượng của Javascript 
3 
 Giới thiệu về Javascript 
Javascript: 
Là một ngôn ngữ kịch bản 
Là một ngôn ngữ thông dịch 
Được thiết kế để tăng khả năng tương tác với người dùng của HTML 
Được nhúng trực tiếp vào trong trang HTML 
Chỉ là một đoạn mã lệnh máy tính có thể thực hiện được 
Không phân biệt kiểu dữ liệu như C++ hay Java. Nó không phân biệt rõ ràng giữa các kiểu xâu kí tự hay mảng. 
4 
Giới thiệu về Javascript 
Javascript cho phép: 
 Đưa các đoạn mã chương trình động vào trong HTML. Ví dụ hiển thị ngày tháng hiện tại 
Trang web có thể phản ứng lại với các sự kiện. Ví dụ khi người dùng nhấn vào một nút bấm trong một form thì dữ liệu trong form sẽ được kiểm tra 
Đọc và viết các thành phần HTML 
5 
Giới thiệu về Javascript 
Lịch sử 
Java được đưa ra bởi Sun nhằm nâng cao và hỗ trợ khái niệm lập trình hướng đối tượng 
Livescript được tạo ra bởi Netscape nhằm đưa lập trình hướng đối tượng vào Web. Về sau, nó được đổi tên là Javascript vì nó giống Java 
Microsoft cũng không muốn đứng ngoài cuộc và đưa ra JScript , một phiên bản Javascript sở hữu riêng của Microsoft 
6 
Đưa Javascript vào trong HTML 
Ví dụ đơn giản 
	alert(“Hello world”); 
Mã javascript được viết bên trong thẻ  
7 
Đưa Javascript vào trong HTML 
Mã javascript có thể được đặt trong phần HEAD 
	.... 
Đảm bảo script được nạp trước khi người sử dụng có thể dùng nó 
Script được thực hiện khi một hàm của nó được gọi trong phần BODY 
Dat loi goi ham ben trong the  
8 
Đưa Javascript vào trong HTML 
Mã javascript có thể được đặt trong phần BODY 
Script được thực hiện khi trang web được nạp. 
Script tạo ra nội dung của trang web tại vị trí mà nó được viết 
	.... 
9 
Đưa Javascript vào trong HTML 
Đặt javascript trong một file ngoài 
Mã lệnh javascript đặt trong file .js 
Để sử dụng các mã lệnh này, cần chỉ ra đường dẫn đến file trong trường src: 
File .js có thể sử dụng bởi nhiều file HTML 
Khi gọi 1 hàm hay thủ tục trong file .js, lời gọi phải được viêt trong thẻ  
10 
Đưa Javascript vào trong HTML 
Ví dụ 
HTML: 
 hello() 
Javascript: 
function hello() 
{	alert(“Hello world”); } 
11 
Câu lệnh trong Javascript 
Tương tự như trong Java 
Mỗi câu lệnh kết thúc bằng 1 dấu ; 
Các câu lệnh có thể được nhóm với nhau bởi dấu { và dấu } 
{ 
document.write("This is a header"); 
document.write("This is a paragraph"); 
document.write("This is another paragraph"); 
} 
Ghi chú: 
// đây là một ghi chú chỉ gồm một dòng 
/* đây là một ghi chú có thể kéo dài trên nhiều dòng */ 
12 
Kiểu dữ liệu trong Javascript 
Các kiểu dữ liệu cơ bản 
Kiểu boolean 
2 giá trị: true, false 
Kiểu số 
Số nguyên: 
2002  (cơ số 10) 
0xFF  (cơ số 16) 
Số thực: 
3.1415926535 
3.0E+8 
Kiểu xâu kí tự 
Chứa một chuỗi các kí tự tuỳ ý 
13 
Kiểu dữ liệu trong Javascript 
Các kí tự đặc biệt 
\b: xoá 1 kí tự trước đó 
\t: tab 
\n: xuống dòng 
\f: nhảy sang trang tiếp theo 
\”: “ 
\’: ’ 
\\: \ 
null: thiếu giá trị 
undefined: một giá trị không được định kiểu 
Một số tính chất 
infinity: giá trị vô cùng lớn 
NaN: biểu diễn kết quả của một phép toán không hợp lệ. Ví dụ chia cho 0. 
14 
Biến trong Javascript 
Các biến đơn 
Là một đơn vị bộ nhớ lưu trữ dữ liệu và được truy cập qua định danh 
Quy tắc tên biến 
phân biệt giữa chữ hoa và chữ thường 
Bắt đầu bằng 1 chữ cái hoặc “_” 
Khác với các từ khoá của Javascript 
Cách khai báo 
var ten_bien= gia_tri; 
ten_bien = gia_tri; 
Kiểu dữ liệu không được đặc tả khi khai báo 
Thời gian sống của biến –Life time 
15 
Biến trong Javascript 
Ví dụ: 
Các biến nhận giá trị kiểu boolean 
var fini = false; 
termine = true; 
non_non = (0 == 1); 
Các biến kiểu số: 
var nam = 2002, thang = 3, ngay = 30; 
n = 27; 
Các biến kiểu xâu: 
var ten = “Jean-Claude”; 
ho = "Nadeau\n"; 
var titre = new String(“Day la mot xau ki tu"); 
16 
Các từ khoá của Javascript 
17 
Các từ khoá của Javascript 
18 
Biến mảng 
Khai báo 
var mang_m = new Array(n);   
n: số phần tử 
Khởi tạo 
var liste = [9, 27, "Allo", 54, 33]; 
k = liste[0] + liste[4]; 
Có thể đặt tên cho các phần tử một mảng thay vì đánh số chúng 
table[“thu_nhat"] = 1; 
table[“thu_hai"] = “Vi tri thu 2"; 
Một phần tử của một mảng có thể là một mảng khác 
var matrix = new Array(3); 
matrix[0] = new Array(3); 
matrix[1] = new Array(3); 
matrix[2] = new Array(3); 
matrix[0][1][1] = 18; 
var multi = [1, 3, [2, 4], 9, 78];