Thiết kế và lập trình web 1 - Bài 6 (Phần 1/2): Ngôn ngữ Script - JavaScript & VBScript

Lập trình và Thiết kếWeb 1 © 2007 Khoa Công nghệ thông tin Khoa CNTT – ĐH.KHTN Bài 6 – Phần 1/2 Ngôn ngữ Script – Javascript & VBscript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nội dung ƒ DHTML ƒ Ngôn ngữ Script ƒ Javascript ƒ VBscript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nội dung ƒ DHTML ƒ Ngôn ngữ Script ƒ Javascript ƒ VBscript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN DHTML ƒ DHTML = Dynamic HyperText Markup Language ƒ DHTML = HTML + CSS + ClientScript + HTML DOM ƒ Tích hợp các tính năng của các trình duyệt thế hệ thứ 4 (IEv5, Netscape 4, Firefox 2.0+, Opera 7.0, …) Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nội dung ƒ DHTML ƒ Ngôn ngữ Script ƒ Javascript ƒ VBscript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Ngôn ngữ Script – Giới thiệu ƒ Là ngôn ngữ dạng thông dịch ƒ Giúp trang web có tính tương tác với người dùng ƒ Các ngôn ngữ script thông dụng – Javascript (Netscape) – Jscript (Microsoft) – VBScript (Microsoft) Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Ngôn ngữ Script - Ứng dụng ClientSide và ServerSide ƒ Ứng dụng Client-Side: – Thực hiện tại Browser (Nescape Navigator, IE, Firefox, Safari, ...) – Script tại Client-Side (Thực hiện các tương tác với người dùng, thay đổi cấu trúc trang web, kiểm tra dữ liệu được nhập vào của người dùng, …) ƒ Ứng dụng Server-Side: – Thực hiện tại WebServer (IIS, Netscape Enterprise Server, ….) – Script tại Server-Side (kết nối CSDL, chia sẽ thông tin giữa các người duyệt web, truy cập hệ thống file trên server, …) Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Ngôn ngữ Script – Quá trình thực hiện script tại server ƒ Quá trình thực hiện ứng dụng Server-Side gồm 2 giai đoạn: – Tạo trang Web có chứa cả Srcipt Client-Side và Script Server-Side – Khi Client browser yêu cầu thực hiện, server (run-time engine) sẽ thực hiện các lệnh Server-side Scipts và trả trang Web HTML về browser Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Ngôn ngữ script – Nhúng Script vào trang web ƒ Định nghĩa script trực tiếp <!-- // Lệnh Javascript --> ƒ Nhúng script từ 1 file khác ƒ Định nghĩa script trực tiếp <!-- ‘ Lệnh VBScript --> ƒ Nhúng script từ 1 file khác Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Ngôn ngữ script – Vị trí đặt script trong HTML ƒ Đặt giữa tag và : đoạn script sẽ thực thi ngay khi trang web được mở. ƒ Đặt giữa tag và : Đoạn script trong phần body được thực thi khi trang web đang mở (sau khi thực thi các đoạn script có trong phần ). ƒ Số lượng đoạn script không hạn chế. Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nhúng Javascript vào trang web some statements some statements some statements Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN VD: Nhúng Javascript vào trang web document.write(“Hello world!”); document.write(“Hello world!”); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nội dung ƒ DHTML ƒ Ngôn ngữ Script ƒ Javascript ƒ VBScript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Cú pháp và quy ước ƒ Javascript phân biệt chữ hoa – chữ thường – Ví dụ : Hai biến Java, java là khác nhau ƒ Tất cả các câu lệnh javascript đều cách nhau bởi dấu “;” ƒ Không phân biệt khoảng trắng, Tab, xuống dòng trong câu lệnh. ƒ Chuổi và dấu nháy – Chuổi trong javascript được đặt trong cặp nháy đơn (‘’) hoặc nháy kép (“”) – Ví dụ : <input type=“button” value=“Click Me!” onclick=“alert(‘Hello’);” Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Cú pháp và quy ước ƒ Ký tự ‘\’ : Ví dụ : ‘You did\’t get that done’ ƒ Các loại dấu ngoặc : \b : Backspace \’ : Dấu nháy đơn \t : tab \f : Form feed \” : Dấu nháy kép \n : New line \r : carriage return { } Đánh dấu khối lệnh [ ] Sử dụng trong cấu trúc Mảng ( ) Sử dụng trong hàm, thuộc tính đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Cú pháp và quy ước ƒ Ghi chú : Theo cú pháp ghi chú của C++ // Đây là ghi chú /* Đây là ghi chú nhiều dòng*/ ƒ Tên biến và hàm : – Bắt đầu bằng Ký tự (A..Z, a..z), _, $ – Không được bắt dầu bằng ký số (0..9) – Không có khoảng trắng giữa tên (biến hoặc hàm) – Không được đặt tên trùng từ khóa – Ví dụ : x x13 _money $money add_two_num(….) addTwoNum(…..) Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Danh sách từ khóa Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Khai báo biến ƒ Khai báo biến bằng từ khóa var ƒ Javascript đòi hỏi các biến phải được khai báo trước khi sử dụng ƒ Thật sự tồn tại khi bắt đầu gán giá trị cho biến lần đầu tiên ƒ Ví dụ : var x ; var y, sum ; var x = 1, y = -10, sum = 0; Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Kiểu dữ liệu Kiểu dữ liệu Ví dụ Mô tả Object var listBooks = new Array(10) ; Trước khi sử dụng, phải cấp phát bằng từ khóa new String “The cow jumped over the moon.” “40” Chứa được chuổi unicode Chuổi rỗng “” Number 0.066218 12 Theo chuẩn IEEE 754 boolean true / false undefined var myVariable ; myVariable = undefined null connection.Close(); connection = null function var add = new function("x", "y", "return(x+y)"); add(2, 3); functionName = new function( [argname1, [... argnameN,]] body ); 1 Biến trong javascript có thể lưu bất kỳ kiểu dữ liệu nào. Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Kiểu dữ liệu var a = 10; document.write(a + “”); a = a + “10” ; document.write(a); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Toán tử Loại Toán tử Ví dụ Toán học + - * / % ++ -- So sánh = != == Luận lý && || ?: , Xử lý bit ~ > >>> & (and) | (or) ^ (xor) Gán = += -= *= /= %= >>= <<= &= |= ^= Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Một số đối tượng dữ liệu ƒ String Object ƒ Number Object ƒ Date Object ƒ Math Object ƒ Array Object ƒ ActiveX Object Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – String . Thuộc tính ƒ length : chiều dài của chuổi ƒ constructor : Dùng để kiểm tra kiểu của biến ƒ prototype : Bổ sung prototype hàm cho một đối tượng ƒ Nối kết các chuỗi bằng toán tử + Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – String . Thuộc tính . Ví dụ Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – String . Thuộc tính . Ví dụ Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN ƒ anchor ƒ big ƒ blink ƒ bold ƒ charAt ƒ charCodeAt ƒ concat ƒ fixed ƒ fontcolor ƒ fontsize ƒ replace ƒ search ƒ slice ƒ small ƒ split ƒ strike ƒ sub ƒ substr ƒ substring ƒ fromCharCode ƒ indexOf ƒ italics ƒ lastIndexOf ƒ link ƒ localeCompare ƒ match ƒ sup ƒ toLocaleLowerCase ƒ toLocaleUpperCase ƒ toLowerCase ƒ toUpperCase ƒ toString ƒ valueOf Javascript – String . Phương thức Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTNĐHKHTN-CNTT-Lương Hán Cơ 33 Javascript – String . Phương thức Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTNĐHKHTN-CNTT-Lương Hán Cơ 34 Javascript – String . Phương thức Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – String – ví dụ Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Number ƒ Kiểu dữ liệu số nguyên, số thực ƒ Bắt đầu bằng ký số “0” : Số nguyên hệ bát phân ƒ Bắt đầu bằng “0x” : Số nguyên hệ thập lục phân ƒ VD : Cho biết giá trị thập phân tương ứng của các number sau : – 125 = ? – 010 = ? 014 = ? 028 = ? – 0xFF = ? 0x3.12 = ? Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Number . Thuộc tính ƒ constructor ƒ prototype ƒ MAX_VALUE (khoảng = 1.79E+308) ƒ MIN_VALUE (khoảng = 5.00E-324) ƒ NaN ƒ NEGATIVE_INFINITY ( = - MAX_VALUE) ƒ POSITIVE_INFINITY (= - MIN_VALUE) Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Number . Phương thức ƒ toExponential numObj.toExponential([fractionDigits]) ƒ toFixed numObj.toFixed([fractionDigits]) ƒ toPrecision numObj.toPrecision ([precision]) ƒ toString objectname.toString([radix]) radix : [2; 8; 10; 16] Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Number . Phương thức . Ví dụ Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Một số hàm chuyển kiểu giá trị ƒ Chuyển chuổi thành số parseInt(); parseFloat(); parseInt(“42”) // result = 42 parseInt(“42.33”) // result = 42 parseFloat(“42.33”) // result = 42.33 3 + 3 + parseInt(“3”) // result = 9 ƒ Chuyển số thành chuỗi (auto): 3 + “3” // result = “33” 3 + 3 + “3” // result = “63” (“” + 2500) // result = “2500” (“” + 2500).length // result = 4 ƒ isNaN(number) Æ true nếu number khác NaN ƒ isFinite(number) Æ true nếu number khác NaN, NEGATIVE_INFINITY, POSITIVE… Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Math Thuộc tính : „ E „ LN2 „ LN10 „ LOG2E „ LOG10E „ PI „ SQRT1_2 „ SQRT2 ƒ abs ƒ acos ƒ asin ƒ atan ƒ atan2 ƒ ceil ƒ cos ƒ exp ƒ floor ƒ log ƒ max ƒ min ƒ pow ƒ random ƒ round ƒ sin ƒ sqrt ƒ tan Phương thức : Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Math ƒ Ví dụ: var x = Math.random(); document.write(x); // x = 0 Æ 1 Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Date . Thuộc tính ƒ var dateObj = new Date() ƒ var dateObj = new Date(dateVal) ƒ var dateObj = new Date(year, month, date[,hours[,minutes[,seconds[,ms]]]]) ƒ var dateObj = new Date(dateString) ƒ var dateObj = new Date(miliseconds); // since midnight on Jan 1, 1970 Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Date . Phương thức ƒ getDate ƒ getDay ƒ getFullYear ƒ getHours ƒ getMilliseconds ƒ getMinutes ƒ getMonth ƒ getSeconds ƒ getTime ƒ getTimezoneOffset ƒ getVarDate ƒ getYear ƒ setDate ƒ setFullYear ƒ setHours ƒ setMilliseconds ƒ setMinutes ƒ setMonth ƒ setSeconds ƒ setTime ƒ setYear ƒ parse ƒ toDateString ƒ toGMTString ƒ toLocaleDateString ƒ toLocaleString ƒ toLocaleTimeString ƒ toString ƒ toTimeString ƒ toUTCString Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Array „ var arrayObj = new Array() „ var arrayObj = new Array([size]) „ var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]) „ var arrayObj = new Array(Array) „ Chỉ số mảng bắt đầu bằng chỉ mục 0 „ concat „ join „ pop „ push „ reverse „ shift „ slice „ sort „ splice „ toString „ unshift „ length „ constructor „ prototype Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Array ƒ Ví dụ: var myList = new Array(); myList[0] = 11; myList[1] = 22; myList[2] = “Hello”; for (i=0; i<myList.length; i++) { document.write(myList[i] + “-”); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Array ƒ Ví dụ: var myList = new Array(); myList[0] = 11; myList[1] = 22; myList[4] = “Hello”; document.write( myList.length + “”); for (i=0; i<myList.length; i++) { document.write(myList[i] + “-”); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Array ƒ Ví dụ: var myList = new Array(); myList[0] = 11; myList[1] = 22; myList[4] = “Hello”; delete myList[1]; delete myList[2]; document.write( myList.length + “”); for (i=0; i<myList.length; i++){ document.write(myList[i] + “-”); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Array . Phương thức Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Array nhiều chiều ƒVí dụ về mảng 2 chiều var i,j; var MyArray = new Array(2); for (i=0; i<MyArray.length; i++) MyArray[i] = new Array(3); MyArray[0][0] = "Ryan Dias"; MyArray[0][1] = 1; MyArray[0][2] = "Photoshop"; MyArray[1][0] = "Mike Donne"; MyArray[1][1] = 2; MyArray[1][2] = ".NET"; for (i=1; i>=0; i--) for (j=2; j>=0; j--) document.write(“ “ + MyArray[i][j]); ƒ JavaScript hỗ trợ đến 60 chiều Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – ActiveX Object ƒ Cú pháp : newObj = new ActiveXObject(servername.typename[, location]) Obj = GetObject([pathname] [, class]) ƒ ActiveX - Dictionary: var y = new ActiveXObject("Scripting.Dictionary"); y.add ("a", "test"); if (y.Exists("a")) document.write("true"); ƒ ActiveX - FileSystemObject : var fso = new ActiveXObject("Scripting.FileSystemObject"); var a = fso.CreateTextFile("c:\\testfile.txt", true); a.WriteLine("This is a test."); a.Close(); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Cấu trúc điều khiển ƒ Điều kiện if ƒ Điều khiển switch ƒ Vòng lặp for ƒ Vòng lặp while ƒ Vòng lặp do.. While ƒ Vòng lặp for …. in ƒ Từ khóa : break, continue Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Điều kiện if if (condition) { statement[s] if true } else { statement[s] if false } Ví dụ: var x = 5, y = 6, z; - if (x == 5) { if (y == 6) z = 17; } else z = 20; - if (x == 5) z = 7; y = 42; else z = 19; Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Điều khiển switch switch (expression) { case label : statementlist case label : statementlist ... default : statementlist } Ví dụ : var diem = “G”; switch (diem) { case “Y”: document.write(“Yếu"); break; case “TB”: document.write(“Trung bình"); break; case “K”: document.write(“Khá"); break; case “G” : document.write(“Giỏi"); break; default: document.write(“Xuất sắc") } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Vòng lặp for for ([initial expression]; [condition]; [update expression]) { statement[s] inside loop } ƒ Ví dụ: var myarray = new Array(); for (i = 0; i < 10; i++) { myarray[i] = i; } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Vòng lặp while while (expression) { statements } ƒ Ví dụ: var i = 9, total = 0; while (i < 10) { total += i * 3 + 5; i = i +5; } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Vòng lặp do…while do { statement } while (expression); ƒ Ví dụ: var i = 9, total = 0; do { total += i * 3 + 5; i = i +5; } while (i > 10); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascrip – Vòng lặp for … in for (variable in [object | array]) { statements } ƒ Ví dụ: var a = new Array(2); a[0] = 10; a[1] = 20; var e, i = 0, b = new Array(2); for (e in a) { b[i] = e / 10 - 1; i++; } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Hàm ƒ Dạng thức khai báo chung: function Tên_hàm(thamso1, thamso2,..) { ……… } ƒ Hàm có giá trị trả về: function Tên_hàm(thamso1, thamso2,..) { ……… return (value); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Hàm – Ví dụ ƒ Ví dụ: function Sum(x, y) { tong = x + y; return tong; } ƒ Gọi hàm: var x = Sum(10, 20); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript – Nội dung ƒ Cú pháp và quy ước ƒ Một số cấu trúc lập trình cơ bản – Khai báo biến – Kiểu dữ liệu – Toán tử – Một số đối tượng dữ liệu – Cấu trúc điều khiển – Hàm – Lớp đối tượng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Lớp đối tượng ƒ Khai báo lớp: function Tên_lớp() { //Khai báo biến thành viên this.bien1 = value; this.bien2 = value; } ƒ Định nghĩa hàm thành viên của lớp: // Khai báo phương thức của lớp Tên_lớp.prototype.Ten_phuongthuc = function(…) { …… //return value; } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Javascript - Lớp đối tượng // Khai báo lớp Diem function Diem() { this.x = 0; this.y = 0; } // Khai báo lớp DoanThang function DoanThang() { this.diem1 = new Diem();this.diem2 = new Diem(); } DoanThang.prototype.Tinh_Dodai = function() { var chieudai = new Number();chieudai = … …return chieudai; } // Sử dụng lớp var canhhuyen = new DoanThang(); …… var x = canhhuyen.Tinh_Dodai(); Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN JavaScript - Lớp đối tượng – Kế thừa (OOP) function superClass() { this.bye = superBye; this.hello = superHello; } function subClass() { this.inheritFrom = superClass; this.inheritFrom(); this.bye = subBye; } function superHello() { return "Hello from superClass"; } function superBye() { return "Bye from superClass"; } function subBye() { return "Bye from subClass"; } function printSub() { var newClass = new subClass(); alert(newClass.bye()); alert(newClass.hello()); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN JavaScript - Lớp đối tượng – Kế thừa (OOP) function superClass() { this.bye = superBye; this.hello = superHello; } function subClass() { this.bye = subBye; } subClass.prototype = new superClass; function superHello() { return "Hello from superClass"; } function superBye() { return "Bye from superClass"; } function subBye() { return "Bye from subClass"; } function printSub() { var newClass = new subClass(); alert(newClass.bye()); alert(newClass.hello()); } Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN Nội dung ƒ DHTML ƒ Ngôn ngữ Script ƒ Javascript ƒ VBScript Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 69 VBScript - Giới thiệu ƒ VBScript là ngôn ngữ lập trình kiểu thông dịch dành cho Web.Khi đoạn mã VBScript được chèn vào trang HTML thì trình duyệt Web sẽ thông dich và thực hiện ƒ VBScript do Microsoft phát triển .Cú pháp của nó gần giống như ngôn ngữ Visual Basic. ƒ VBScript là ngôn ngữ script được viết phía client và nó chỉ được hổ trợ tốt nhất trên trình duyệt Internet Explore của Microsoft. Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 70 VBScript - Biến, kiểu dữ liệu ƒ Khai báo biến thông qua từ khóa dim – Dim x, y ,z – Dim a(10) ‘khai báo 1 mảng 1 chiều có 10 phần tử – Dim b(5,10) ‘khai báo mảng 2 chiều – Redim a(20) ‘khai báo lại mảng a, tăng thêm 10 phần tử (vẫn giữ lại giá trị 10 phần tử đầu) ƒ Kiểu dữ liệu – Khi khai báo, biến chỉ có 1 kiểu là variant – Các kiểu dữ liệu con (number, string, boolean, object, …) sẽ được gán cho biến khi sử dụng Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 71 VBScript - Cấu trúc điều kiện If Then End if If Then....Else ... End If Select Case Case ....Case .....Case Else ...... End Select Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 72 VBScript - Cấu trúc lặp Do While .... Loop Do .... Loop While While ............... WEnd Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 73 VBScript - Cấu trúc lặp For = To ............... Next For = To Step ............... Next For Each in ... Next Lập trình và Thiết kếWeb 1 – Bài 6 : Ngôn ngữ Script (Javascript & VBScript) © 2007 Khoa CNTT - ĐHKHTN 74 VBScript - Hàm , thủ tục ƒ Function () ............... End Function ƒ Sub () .... End Sub