Bài 1: Tổng Quan V Ề Javascrip

BÀI 1 TỔNG QUAN V Ề JAVASCRIP PHẦN I NGÔN NGỮ JAVASCRIP CHƯƠNG I TỔNG QUAN VỀ JAVASCRIP 1 Ðặc tính của ngôn ngữ Javascript Javascript là một ngôn ngữ thông dịch (interpreter), chương trình nguồn của n[.]

PHẦN I: NGÔN NGỮ JAVASCRIP CHƯƠNG I :TỔNG QUAN VỀ JAVASCRIP Ðặc tính ngơn ngữ Javascript: Javascript ngơn ngữ thơng dịch (interpreter), chương trình nguồn nhúng (embedded) tích hợp (integated) vào tập tin HTML chuẩn Khi file load Browser (có support cho JavaScript), Browser thông dịch Script thực cơng việc xác định Chương trình nguồn JavaScript thơng dịch trang HTML sau tồn trang load trước trang hiển thị Javascript ngơn ngữ có đặc tính: *  Ðơn giản * Ðộng (Dynamic) * Hướng đối tượng (Object Oriented) Ngơn ngữ JavaScript: Một đặc tính quan trọng ngôn ngữ JavaScript khả tạo sử dụng đối tượng (Object) Các Object cho phép người lập trình sử dụng để phát triển ứng dụng Trong JavaScript ,các Object nhìn theo khía cạnh: a Các Object tồn b Các Object người lập trình xây dựng Trong Object tồn chia thành kiểu: a Các Object JavaScript (JavaScript Built-in Object) b Các đối tượng cung cấp môi trường Netscape Built-in Object JavaScript: JavaScript cung cấp Built-in Object để cung cấp thông tin hành đối tượng load trang Web nội dung nó.Các đối tượng bao gồm phương pháp (Method) làm việc với thuộc tính (Properties) Các đối tượng cung cấp môi trường Netscape: Netscape Navigator cung cấp đối tượng cho phép JavaScript tương tác với file HTML, đối tượng cho phép điều khiển việc hiển thị thông tin đáp ứng kiện mơi trường Navigator Ví dụ:  Ðối tượng Mơ tả Window Cung cấp phương pháp tính chất cho cửa sổ hành trình duyệt,bao gồm đối tượng cho mỗi  frame Location : Cung cấp tính chất phương pháp làm việc với địa URL : hành mở History : Các đối tượng history cung cấp thông tin danh sách cũ giới hạn tương tác với danh sách Document : Ðây đối tượng sử dụng nhiều Nó chứa đựng Ðối tượng,tính chất phương pháp làm việc với thành phần tài liệu :form,link,anchor,applet Các đối tượng người lập trình xây dựng: a Ðịnh nghĩa thuộc tính đối tượng: (Object Properties) Cú pháp : Object-name.Property-name (tên đối tượng.tên đặc tính) Ví dụ :Một đối tượng airplane có thuộc tính sau: Airplane.model , Airplane.price, Airplane.seating , Airplane.maxspeed, Airplane.fuel b Thêm phương pháp cho đối tượng:( Method to Object) Sau có thơng tin airplane ta tiếp tục xây dựng phương pháp để sử dụng thơng tin này.Ví dụ bạn muốn in mơ tả airplane tính tốn khoảng cách tối đa hành trình với nhiên liệu có: Airplane.description() Airplane.distance() c Tạo instance đối tượng: Trước thao tác với đối tượng JavaScript ta phải tạo instance cho đối tượng Nhúng JavaScript vào tập tin HTML:  Cú pháp: JavaScript Program Thuộc tính thẻ SCRIPT + SRC :Ðịa URL đến tập tin chương trình JavaScript (*.js) + LANGUAGE: Chỉ định ngôn ngữ sử dụng Script phiên sử dụng (ví dụ :JavaScript ,JavaScript 1.2 vv ,VBScript) Ẩn Scripts Browser khơng cung cấp JavaScript: Sử dụng tập tin JavaScript bên ngồi : Thêm chương trình vào tập tin HTML: Listing 2.1 Here is result:                                  CHƯƠNG II: SỬ DỤNG JAVASCRIP                  1.Cú pháp lệnh : JavaScript xây dựng hàm,các phát biểu,các toán tử biểu thức dịng kết thúc ; Ví dụ: document.writeln("It work"); Các khối lệnh: Nhiều dịng lệnh liên kết với bao { } Ví dụ: { document.writeln("Does It work"); document.writeln("It work!"); } Xuất liệu cửa sổ trình duyệt: Dùng phương pháp document.write() document.writeln() Ví dụ: document.write("Test"); document.writeln("Test"); Xuất thẻ HTML từ JavaScript : Ví dụ : Outputting Text This is text plain Sử dụng phương pháp writeln() với thẻ PRE: Outputting Text Các kí tự đặc biệt chuổi: \n : New line \t : Tab \r : carriage return \f : form feed \b: backspace Ví dụ: document.writeln("It work!\n"); Làm việc với dialog boxes : Sử dụng hàm alert() để hiển thị thơng báo hộp Ví dụ: Example 2.5 Tương tác với người sử dụng: Sử dụng phương pháp promt() để tương tác với người sử dụng Ví dụ : Listing 2.6 Có thể sử dụng dấu + để cộng chuổi đơn lại Các kiểu liệu JavaScript: a Dữ liệu kiểu số: + Số nguyên: ví dụ 720 + Số Octal: ví dụ :056 + Số Hexa:ví dụ:0x5F + Số thập phân :ví dụ :7.24 , -34.2 ,2E3 b Dữ liệu kiểu chuổi: Ví dụ: " Hello" ?245? "" c Dữ liệu kiểu Boolean: Kết trả true false d Dữ liệu kiểu null: Trả giá trị rỗng e Dữ liệu kiểu văn (giống kiểu chuổi) 10 Tạo biến JavaScript: Var example; Var example="Hello"; Ta dùng document.write(example); để xuất nội dung biến Ví dụ 1: dùng từ khóa var để khai báo biến Example 3.1 Ví du 2: tạo lại giá trị cho biến Example 3.2 var name=prompt("enter your name:","name"); alert ("greeting " + name + " , "); name=prompt("enter your friend's name:","friend's name"); 11 Làm việc với biến biểu thức:  Thiết lập biểu thức: Cú pháp: * Toán tử: = : Thiết lập giá trị bên phải cho bên trái += : Cộng trái phải ,sau gán kết cho bên trái phép toán -= : Trừ bên trái cho bên phải ,gán kết lại cho bên trái *= : Nhân bên trái cho bên phải,gán kết cho bên trái /= : Chia bên trái cho phải ,gán kết lại cho bên trái %= : Chia bên trái cho bên phải lấy số dư gán lại cho bên trái * Các toán tử khác: Ví dụ: x+=15+3 => x=18 8+5 32.5 * 72.3 12 % Dấu ++ dấu - - dấu Ví dụ: x=5; y=++x; (=> y=6 x tăng lên 6) z=x++; (=> z=6 sau x gán cho z) sau x tăng => x=7 Do ta có kết cuối là: x=7;y=6;z=6; Ví dụ: x=5; x=-x => x=-5  Phép toán Logic: && : ||: ! : not Ví dụ: x=5 ,y=2 ,c=3 (x>y) && (x>c) false && anything is always false (x>y) || (c true !x  Toán tử so sánh JavaScript: == ; != ; > ;< ; >= ; Ví dụ : Sử dụng phương pháp confirm() với phát biểu if - else Example 3.3 var question="What is 10+10 ?"; var answer=20; var correct=''; var incorrect=''; var response=prompt(question,"0"); if (response != answer) { if (confirm("Wrong ! press OK for a second change")) response=prompt(question,"0"); }else { if (confirm("Correct ! press OK for a second question")) { question="What is 10*10"; answer=100; response=prompt(question,"0"); } } var output = (response ==answer ) ? correct:incorrect ; CHƯƠNG III: HÀM VÀ ÐỐI TƯỢNG Trong kỹ thuật lập trình lập trình viên thường sử dụng hàm để thực đoạn chương trình thể cho module để thực cơng việc Trong Javascript có hàm xây dựng sẵn để giúp bạn thực chức ví dụ hàm alert(), document.write(), parseInt() bạn định nghĩa hàm khác để thực cơng việc bạn, để định nghĩa hàm bạn theo cú pháp sau: function function_name(parameters, arguments) { command block }  Truyền tham số: function printName(name) { document.write("Your Name is "); document.write(name); document.write(""); } Ví dụ: Gọi hàm printName()với lệnh sau printName("Bob"); Khi hàm printName()được thi hành giá trị name "Bob" gọi hàm printName()với đối số biến var user = "John"; printName(user); Khi name "John" Nếu bạn muốn thay đổi giá trị name bạn làm sau : name = "Mr " + name;  Phạm vi biến: Biến toàn cục (Global variable) Biến cục (Local variable)  Trả giá trị: Ví dụ: Dùng return để trả giá trị biến cube MTWRFSS function cube(number) { var cube = number * number * number; return cube; } Ví dụ: MTWRFSS Example 4.1 ?; var incorrect=??; //ASK THE QUESTION var response=prompt(output,"0"); //CHECK THE RESULT return (response == answer) ? correct : incorrect; } // STOP HIDING FROM OTHER BROWSERS > Hàm eval dùng chuyển đổi giá trị chuổi số thành giá trị số eval("10*10")trả giá trị 100  Hàm gọi lại hàm: Ví dụ: Example 4.2 ?; var incorrect=??; //ASK THE QUESTION var response=prompt(output,"0"); //CHECK THE RESULT return (response == answer) ? correct : testQuestion(question); } // STOP HIDING FROM OTHER BROWSERS > CHƯƠNG IV: TẠO ĐỐi TƯỢNG TRONG JAVASCRIP Ðịnh nghĩa thuộc tính đối tượng: function student(name,age, grade) { this.name = name; this.age = age; this.grade = grade; } Ðể tạo Object ta sử dụng phát biểu new.Ví dụ để tạo đối tượng student1 student1 = new student("Bob",10,75); thuộc tính đối tượng student1 : student1.name student1.age student1.grade Ví dụ để tạo đối tượng student2 student2 = new student("Jane",9,82); Ðể thêm thuộc tính cho student1 bạn làm sau: student1.mother = "Susan"; bạn định nghĩa lại hàm student MTWRFSS function student(name, age, grade, mother) { this.name = name; this.age = age; this.grade = grade; this.mother = mother; } Ðối tượng thuộc tính đối tượng khác: Ví dụ: function grade (math, english, science) { this.math = math; this.english = english; this.science = science; } bobGrade = new grade(75,80,77); janeGrade = new grade(82,88,75); student1 = new student("Bob",10,bobGrade); student2 = new student("Jane",9,janeGrade); student1.grade.math:dùng để lấy điểm Tốn student1 student2.grade.science: dùng lấy điểm mơn Khoa học student2 Thêm phương pháp cho đối tượng: function displayProfile() { document.write("Name: " + this.name + ""); document.write("Age: " + this.age + ""); document.write("Mother?s Name: " + this.mother + ""); document.write("Math Grade: " + this.grade.math + ""); document.write("English Grade: " + this.grade.english + ""); document.write("Science Grade: " + this.grade.science + ""); } ... dụng (v? ? dụ :JavaScript ,JavaScript 1.2 vv ,VBScript) Ẩn Scripts Browser không cung cấp JavaScript: JavaScript Program Thuộc tính thẻ SCRIPT + SRC :Ðịa URL đến tập tin chương trình JavaScript (*.js)