Thứ Tư, 6 tháng 1, 2016

JS VÀ VBSCRIPT

52
Chương 3: GIỚI THIỆU NGÔN NGỮ SCRIPT
VBScript VÀ JavaScript
1. GIỚI THIỆU NGÔN NGỮ VBScript VÀ JavaScript
VBScript và JavaScript là ngôn ngữ lập ra để chạy được
trên trình duyệt, các đoạn chương trình viết bằng ngôn ngữ này
được nhúng vào các trang HTML. Các đoạn chương trình này
có khả năng:
 Được thực thi khi một sự kiện nào đó trên trang Web
xảy ra như: mouseclicked, mouseover,…
 Xử lý các thành phần trên trang Web như: thay đổi
màu chữ, font chữ, thay đổi ảnh,…
Cú pháp của VBScript gần giống với cú pháp ngôn ngữ lập
trình VisualBasic và được Microsoft pháp triển, trong khi cú
pháp của JAVAScript gần giống với cú pháp của ngôn ngữ lập
trình C và được Netscape phát triển.
VBScript không phân biệt chữ hoa và chữ thường trong khi
JAVAScript thì lại phân biệt chữ hoa và chữ thường.
JAVAScript được hỗ trợ trên hầu hết các trình duyệt, còn
VBScript chỉ được hỗ trợ tốt nhất ở trình duyệt Internet
Explorer.
Cũng giống như các ngôn ngữ lập trình khác các kiểu dữ
liệu thông dụng được dùng VBScript và JAVAScript là: kiểu
số, kiểu chuỗi, kiểu luận lý,… Tuy nhiên cách định nghĩa các
kiểu dữ liệu giữa VBScript và JAVAScript có sự khác nhau.
Cách khai báo các hàm cũng như cách sử dụng các hàm thư
viện có sẵn cũng khác nhau.53
2. NGÔN NGỮ VBScript
2.1. Chú thích một dòng lệnh
Chú thích trong VBScript tương tự như Visual Basic bắt
đầu bằng ký tự nháy đơn (’). Dấu chú thích chỉ có tác dụng trên
một dòng. Dấu chú thích làm cho các dòng lệnh rõ ràng và dễ
hiểu đối với người thiết kế chương trình. Khi thực thi, trình biên
dịch bỏ qua dòng ghi chú này.
2.2. Cách khai báo biến, hằng, mảng
2.2.1. Khai báo biến
Dùng từ khóa Dim để khai báo biến, biến trong ngôn ngữ
VBScript không cần chỉ định kiểu như trong ngôn ngữ lập trình
cấu trúc. Các biến không cấu trúc được xem là biến vô hướng
(variant) có thể chứa và tự chuyển đổi hầu hết các kiểu dữ liệu.
Cú pháp: Dim tên_biến1, tên_biến2, tên_biến3,…
Các biến được cách nhau bởi dấu phẩy “,”.
Tuy nhiên trong VBScript không nhất thiết phải khai báo
biến trước khi sử dụng. Để yêu cầu các biến phải được khai báo
trước khi sử dụng ta dùng lệnh “Option Explicit” đặt trước lệnh
đầu tiên của đoạn chương trình.
Ví dụ : Dim a
a = 3
Ghi chú:
 Biến không phân biệt chữ HOA/thường
 Chiều dài tên biến không vượt quá 255 ký tự
 Tên biến phải bắt đầu bằng một ký tự chữ cái và biến
không được phép chứa dấu chấm “.”.54
2.2.2. Khai báo hằng
Hằng được định nghĩa bằng từ khóa Const. Chỉ có thể sử
dụng giá trị của hằng chứ không thể thay đổi nội dung hằng.
Ví dụ: Const ten = “Nguyen Van Tuan”
2.2.3. Khai báo mảng
 Mảng một chiều
Dim Tên_mảng(kích thước cuả mảng).
Số phần tử tối đa của mảng trên = Kích thước của mảng + 1.
Chỉ số của phần tử đầu tiên của mảng bằng 0, để truy xuất
đến phần tử có chỉ số “i” ta dùng Tên_mảng(i);.
Ví dụ: Dim A(20); thì mảng A có thể chứa tối đa 21 phần tử
 Mảng hai chiều
Dim Tên_mảng(dòng, cột)
Chỉ số của phần tử ở dòng đầu tiên và cột đầu tiên là (0,0).
Để truy xuất phần đến phần tử có chỉ số dòng i, chỉ số cột j
ta dùng B(i,j).
Ví dụ: Dim B(5,10); mảng B có thể chứa 6 dòng và 11 cột.
Trong VBSCript ta muốn khai báo một mảng động thì khi
khai báo mảng ta không định rõ kích thước cho mảng, tức kích
thước của mảng có thể thay đổi trong quá trình thao tác, dùng
hàm ReDim để thay đổi kích thước của mảng động.
Trong VBScript có thể khai báo một mảng có 60 chiều.
2.3. Các kiểu dữ liệu
Trong VBScript chỉ có một kiểu dữ liệu duy nhất là
Variant. Đây là kiểu dữ liệu có thể chứa các loại dữ liệu từ kiểu
chuỗi, kiểu số cho đến các loại dữ liệu có cấu trúc như kiểu bản
ghi (record). Kiểu dữ liệu này cũng là kiểu dữ liệu trả về của
các hàm và các thủ tục được viết bằng ngôn ngữ VBScript.55
Tùy theo ngữ cảnh sử dụng mà một biến Variant mang giá
trị là kiểu số, kiểu chuỗi (hay bất kỳ kiểu dữ liệu nào khác).
Ví dụ: Trong biểu thức a = b+1997, thì biến a và biến b mang
kiểu dữ liệu là kiểu số. Trong biểu thức a = b + “1997” thì biến
a và biến b có kiểu dữ liệu là kiểu chuỗi.
Các kiểu dữ liệu mà một biến Variant có thể lưu trữ.
Các kiểu dữ liệu Ý nghĩa
Boolean Kiểu luận lý True hoặc False
Byte Số nguyên có giá trị từ 0 đến 255
Interger Số nguyên có giá trị từ -32768 đến
32767
Currency Từ -922,337,203,685,477.5808 đến
922,337,203,685,477.5807
Long Số nguyên từ -2,147,483,648 đến
2,147,483,647
Single Số thực, có giá trị từ 3.402823E38 đến
1.401298E-45 cho các số âm, từ
1.401298E-45 đến 3.402823E38 cho số
dương
Double Số thực, có giá trị từ
1.79769313486232E308 đến
4.94065645841247E-324 cho các số âm,
4.94065645841247E-324 đến
1.79769313486232E308
Date(time) Chứa giá trị ngày từ 01.01.100 đến
31.12.9999
String Chuỗi ký tự có thể chứa 2 tỉ ký tự
Empty Dữ liệu chưa được khởi tạo
Null Null
Object Chứa đối tượng trên Form như hộp văn
bản, nhãn, nút nhấn,…
Error Chứa mã lỗi56
 Để chuyển đổi dữ liệu này sang kiểu dữ liệu khác ta
dùng các hàm thư viện Cbyte (kiểu byte), Cdate (kiểu
ngày), CInt (integer), CStr (string), CBool (bool),
CDbl (double), CLng (long), CSng (Single)
 Muốn biết kiểu dữ liệu mà một biến có kiểu Variant
đang lưu trữ, ta dùng hàm thư viện VarType.
2.4. Các toán tử cơ sở
 Toán tử gán (=)
Tên_biến = Biểu thức.
Với các biến có kiểu dữ liệu tổng quát, để gán giá trị cho
biến chúng ta dùng ta phải dùng lệnh Set như sau:
Set Tên_biến = Biểu thức.
 Toán tử tính toán
+(cộng), - (trừ), * (nhân), \ (chia lấy phần nguyên), /(chia
làm tròn), ^ (lũy thừa), mod (chia lấy phần dư)
 Toán tử nối chuỗi
Dùng & : Ví dụ :S =“Dai”& “ ”& “hoc”
Dùng + : Ví dụ: S = “Dai” + “ ” + “hoc”
 Toán tử so sánh
= (bằng), > (lớn hơn), >= (lớn hơn hay bằng), < (nhỏ hơn),
<= (nhỏ hơn hay bằng), <> (khác).
Kết quả của một biểu thức so sánh sẽ thuộc về kiểu luận lý
(True/False), khi cần nối các biểu thức so sánh với nhau ta
dùng toán tử luận lý And, Or.
2.5. Các lệnh xử lý điều kiện rẽ nhánh
Bạn có thể sử dụng các lệnh rẽ nhánh if..then, if..then..else
hoặc Select case để ra điều kiện rẽ nhánh dựa trên các biểu thức
so sánh.57
2.5.1. Cấu trúc If...Then
Dùng để xử lý lệnh khi biểu thức so sánh của If trả về giá trị
True.
Ví dụ:
Dim myDate
myDate = #2/12/2000#
if myDate < Now Then myDate = Now
end if
2.5.2. Cấu trúc If ...Then...Else
Mở rộng hơn cấu trúc If...Else , khi biểu thức so sánh của If
trả về giá trị True thì khối lệnh sau mệnh đề Then sẽ được thực
hiện. Ngược lại, biểu thức so sánh của If trả về giá trị False thì
khối lệnh sau Else sẽ được thực hiện.
Ví dụ:
Dim myValue
myValue = 13
if myValue mod 2 = 0 Then
document.write(myValue)
document.Write(”la So chan”)
else
document.write(myValue)
document.Write (”la so le”)
end if
2.5.3. Cấu trúc Select Case
Cấu trúc Select Case cho phép lựa chọn nhiều trường hợp
để ra quyết định thực thi. Theo cú pháp sau:
Select case
Case
Khối lệnh 158
Case
Khối lệnh 2
...
Case Else
Khối lệnh i
End Select
Ví dụ:

Select case


Mệnh đề Case Else trong cú pháp Select case dùng trong
trường hợp tất cả các phép so khớp của mệnh đề Case không
xảy ra.
2.6. Cấu trúc lặp
Tương tự các ngôn ngữ lập trình khác, VBScript cung cấp
các lệnh lặp dựa trên điều kiện. Dùng cấu trúc Exit for, Exit
do, Exit while để thoát khỏi cấp trúc lặp tương ứng.59
2.6.1. Cấu trúc Do…Loop
Cấu trúc Do…Loop lặp trong khi điều kiện kiểm tra của
Loop còn đúng. Có bốn cấu trúc lặp theo cú pháp sau:
 Do While
Khối lệnh
Loop
 Do
Khối lệnh
Loop While
 Do Until
Khối lệnh
Loop
 Do
Khối lệnh
Loop Until
Ví dụ: Tính giá trị N!
Dim N,i,S
N=3
S = 1
i=1
DO WHILE (i<=n)
S=S*i
i=i+1
LOOP
2.6.2. Cấu trúc While...Wend
Lặp trong khi điều kiện kiểm tra của While còn đúng. Theo
cú pháp sau:
While
Khối lệnh60
Wend
Ví dụ: Tính tổng S = 1 + 2 + 3 + 5 +...+ N
Dim i,S,N
N=5
i=1
S=0
WHILE (i<=N)
S=S+i
i=i+2
Wend
2.6.3. Cấu trúc For...Next
Cấu trúc For...Next lặp với số lần lặp xác định, cấu trúc này
có hai dạng sau.
 For To
Khối lệnh
Next
 For To Step nhảy>
Khối lệnh
Next
Ví dụ: Tính tổng S = 1 + 2 + 3 + 4 +...+ N
Dim i,S,N
N=5
S=0
FOR i=1 to N
S=S+i
Next
2.6.4. Cấu trúc For Each...Next
Cấu trúc For Each...Next lặp với mỗi phần tử trong tập hợp61
Ví dụ:
Dim d
’Tao doi tuong DictionarySet
d = CreateObject(”Scripting.Dictionary”)
’Luu cac phan tu vao tap hop
d.Add ”0”, ”Athens”
d.Add ”1”, ”Belgrade”
d.Add ”2”, ”Cairo”
’Duyet va in cac phan tu trong tap hop
For Each I in d
document.Write(D.Item(I))
Next
2.7. Khai báo hàm và thủ tục
2.7.1. Khai báo hàm
Function Tên_hàm (các tham số)
Khối lệnh
End Function
Ví dụ: Xây dựng hàm tính diện tích hình tròn khi biết bán kính
Function DienTich(R)
Dim S
S = 3.14*R*R
DienTich=S
document.write(S)
End Function
2.7.2. Khai báo thủ tục
Sub Tên_thủ_tục(các tham số)
Khối lệnh
End Sub62
Ví dụ: Xây dựng thủ tục gọi sử dụng hàm DienTich đã viết trên
Sub SuDung()
DienTich(5)
End Sub
3. NGÔN NGỮ JAVASCRIPT
3.1. Chú thích một hay nhiều dòng lệnh
Dòng lệnh được kết thúc bằng dấu chấm phẩy “;” ở cuối
dòng. Tập hợp các dòng lệnh nằm trong hai dấu ngoặc đơn {}
gọi là tập lệnh.
Muốn chú thích một dòng lệnh ta dùng dấu “//” đặt trước
dòng lệnh muốn chú thích. Muốn chú thích nhiều dòng lệnh thì
ta đặt các dòng lệnh cần chú thích giữa hai dấu “/*” và “*/”.
3.2. Cách khái báo biến, mảng
3.2.1. Cách khai báo biến
Dùng từ khoá var để khai báo biến. Biến trong JavaScript
không cần định rõ kiểu dữ liệu của biến lúc khai báo. Tuy
nhiên, khi gán giá trị cho biến, JavaScript phân biệt kiểu của
các trị mà bạn gán. Trong JavaScript bắt buộc phải khai báo
biến trước khi sử dụng.
var tên_biến1 = trị1, tên_biến2 = trị2, ...;
Chú ý:
+ Biến có phân biệt chữ hoa/thường.
+ Biến phải bắt đầu bằng ký tự chữ cái.
+ Biến không cho phép có khoảng trắng, không cho phép có
dấu gạch ngang.63
3.2.2. Khai báo mảng
 Mảng một chiều
var A = new Array(10)
Mảng A nói trên có 10 phần tử, và chỉ số phần tử đầu tiên
của mảng bắt đầu 0, muốn truy xuất đến phần tử có chỉ số i, ta
dùng A[i].
 Mảng hai chiều
Khai báo A là mảng hai chiều có 10 dòng, 20 cột.
var A = new Array(10),i = 0;
for (i = 0; i<10 i="" p="">A[i] = new Array(20);
Để truy xuất đến phần tử có chỉ số dòng i, chỉ số cột j ta
dùng A[i][j].
3.3. Các kiểu dữ liệu trong JavaScript
Trong JavaScript thường sử dụng các kiểu dữ liệu sau:
3.3.1. Dữ liệu kiểu số
Kiểu số có hai loại thông dụng là kiểu số nguyên và kiểu số
thực.
Ví dụ: var a =10, b=100, ten = “Nguyen Van Ba”;
Các phép toán trên kiểu số
 +, +=, -, - =, *, *=, /, /=, % (chia lấy phần dư), ++ (phép
tăng một đơn vị), -- (phép giảm một đơn vị).
 Các phép so sánh: < (nhỏ), <= (nhỏ hơn hay bằng),
>(lớn), >= , = = (bằng), != (khác).64
3.3.2. Kiểu ký tự
Các ký tự được nằm giữa hai nháy đơn. Ngoài ra còn có các
ký tự đặc biệt sau đây:
Ký tự Ý nghĩa
\n Xuống dòng mới
\t Ký tự Tab
\r Về đầu dòng
\b Ký tự khoảng trắng
Ví dụ : var ch= ‘A’, c = ‘B’;
Các phép toán trên ký tự
 +, += (cộng 2 ký tự)
 Phép toán so sánh : >, >=, < , <=, = =, !=
3.3.3. Kiểu chuỗi
Chuỗi là tập hợp các ký tự.
Một hằng chuỗi được nằm giữa hai dấu nháy đôi “.
Ví dụ: var hoten = “Le Van Tam”;
Các phép toán trên chuỗi
 Phép nối chuỗi: +, +=
 Phép so sánh: <, <= , >, >=, ==, !=
3.3.4. Kiểu luận lý
Một biến có kiểu luận lý tồn tại một trong hai trạng thái: true,
false.
Ví dụ: var t = true, f = false;
Các phép toán trên kiểu luận lý
 Phép so sánh : <, <=, >, >=, ==, !=
 Phép logic : && (và), || (hoặc), ! (phủ định).65
3.3.5. Kiểu ngày
Mô tả thông tin về: Ngày, Tháng, Năm, giờ, phút, giây của
hệ thống.
Ví dụ: var now = new Date();
Các hàm lấy ngày giờ trong đối tượng Date như sau:
Tên hàm Mô tả
GetDate() Ngày: 1..31
GetDay() Ngày trong tuần: 0 (chủ nhật), 1(thứ 2)
GetHours Giờ: 0..23
GetMinutes Phút: 0..59
GetMonth Tháng: 0 (tháng 1)…11(tháng 12)
GetSeconds Giây: 0..59
GetTime Giờ theo mili giây
GetYear Năm
Ví dụ: Ví dụ sau lấy ngày hệ thống và hiển thị lên trình duyệt.
Mã HTML


Outputting Text




66Ngoài các kiểu dữ liệu thông dụng trên còn có các kiểu dữ
liệu object, null.
3.4. Các lệnh xử lý điều kiện rẽ nhánh
3.4.1. Cấu trúc if
Dùng để xử lý lệnh khi biểu thức của if trả về giá trị true
if (biểu thức điều kiện)
Khối lệnh;
3.4.2. Cấu trúc if...else
if (biểu thức điều kiện)
Khối lệnh 1;
else
khối lệnh 2
Ví dụ:
if(a%2==0)
document.write(a, “là số chẵn”);
else
document.write(a, “là số lẻ”);
3.4.3. Cấu trúc switch...case
Cho phép thực hiện nhiều lựa chọn để ra quyết định thực thi.
switch(biến)
{
case giá trị 1:
Khối lệnh 1;
break;
case giá trị 2:
Khối lệnh 2;
break;
…67
default:
Khối lệnh n;
break;
}
3.5. Cấu trúc lặp
Dùng câu lệnh break để thoát khỏi cấp trúc lặp khi cần.
3.5.1. Cấu trúc for
for(biểu thức khởi tạo; biếu thứcđiều kiện; biểu thứcthai đổi)
Khối lệnh;
Khối lệnh được thực hiện khi biểu thức điều kiện còn đúng.
Ví dụ: for (i = 0; i<10 i="" p="">s+=2*i;
3.5.2. Cấu trúc while
while (biểu thức điều kiện)
Khối lệnh;
Khối lệnh được thực hiện khi biểu thức trong while còn đúng.
Ví dụ: i=0;
while(i<20 p="">{ s+=i;
i++;
}
3.5.3. Cấu trúc do..while
do
Khối lệnh;
while(biểu thức điều kiện);68
Khối lệnh được thực hiện trước sau đó kiểm tra biểu thức
điều kiện nếu còn đúng thì quay lên thực hiện khối lệnh.
Ví dụ:
i=0;
do
{
s+=i;
i++;
}while(i<20 p="">3.6. Khai báo hàm
Dùng từ khóa function để khai báo hàm. Muốn trả về giá trị
của hàm ta dùng từ khoá return.
function tên_hàm(danh sách các tham số)
{
Khối lệnh;
}
Ví dụ: function Add(x,y)
{
return(x+y);
}
var t;
t = Add(4,8);
document.write(t);
4. SỬ DỤNG VBSCRIPT VÀ JAVASCRIPT TRONG
TRANG WEB
4.1. Chèn đoạn VBScript/JavaScript vào trang HTML
Các đoạn script nằm giữa tag ,
trong đó ghi rõ ngôn ngữ sử dụng để viết mã chương trình. Các69
đoạn Script được đặt giữa cặp tag hay đặt
giữa cặp tag . Tuy nhiên, nếu đặt giữa tag
thì các đoạn mã này đã được đọc và thông dịch trước
các thành phần nằm trong tag .
Dùng tag để báo cho trình duyệt không hiển thị
các đoạn mã bên trong nếu nó không hiểu tag




Kết quả hiển thị trên trình duyệt
4.2. Xuất/nhập dữ liệu trong VBScript và JavaScript
4.2.1. Xuất dữ liệu
Đối tượng document là đối tượng đại diện cho trang web
hiện hành. Còn đối tượng window thì đại diện cho cửa sổ mà
trong đó trang web hiển thị.
Để xuất dữ liệu ra trang web ta dùng hàm write và hàm
writeln của đối tượng document theo cú pháp.
document.write(“chuỗi cần hiển thị”).
document.writeln(“chuỗi cần hiển thị”);
Chúng ta có thể dùng các tag HTML để xuất dữ liệu trong
các đoạn Script.
Ví dụ: document.write("

Hello Script

")
Để writeln (xuất dữ liệu và về đầu dòng mới) có tác dụng ta
phải dùng kèm theo tag
đứng trước và sau
đoạn Script.
Ví dụ:
71





Để hiển thị các hộp thông báo ta dùng hàm confirm và hàm
alert của đối tượng window. Theo cú pháp sau:
window.alert(“chuỗi cần hiển thị”)
window.confirm(“chuỗi cần hiển thị”)
Đối với VBScript để hiển thị hộp thông báo ta dùng hàm
MsgBox(“chuỗi cần thông báo”);
4.2.2. Nhập dữ liệu
Dùng hàm prompt của đối tượng window để nhập giá trị
cho biến theo cấu trúc sau:
Biến = window.prompt(“chuỗi thông báo”, “trị mặc nhiên”)
Biến = InputBox(“chuỗi thông báo”)
5. XỬ LÝ CÁC SỰ KIỆN KHI TƯƠNG TÁC VỚI
CÁC THÀNH PHẦN TRÊN TRANG WEB
Sự kiện được phát sinh khi ta kích hoạt (onClick,
onMouseOver, onMouseOut...) các thành phần trên trang web
như các nút điều khiểu button, hyperlink, ListBox...
Để xử lý các sự kiện này ta tạo hàm xử lý sự kiện và gán
hàm xử lý sự kiện đó cho tên sự kiện.
=

0 nhận xét: