Tự học lập trình web với PHP: Bài 15 Biến và các kiểu dữ liệu trong javascript

LAB 2: JAVASCRIPT

BIẾN VÀ CÁC KIỂU DỮ LIỆU TRONG JAVASCRIPT

A – LÝ THUYẾT

I – BIẾN TRONG JAVASCRIPT

1 – Khái niệm về Biến

Biến được dùng để lưu trữ những thông tin trong quá trình xử lý một vấn đề nào đó.

2 – Làm việc với Biến

a) Cách khai báo một Biến

Để khai báo một biến trong Javascript chúng ta sử dụng cú pháp sau:

b) Quy tắc đặt tên cho Biến

Tên biến phải bắt đầu bằng ký tự hoặc dấu gạch dưới ( _ ) và không có khoảng trắng

Chú ý: Cách đặt tên cho biến:

Tên biến phân biệt chữ hoa và chữ thường nghĩa là chữ x sẽ khác với chữ X
Đặt tên biến có đầy đủ ý nghĩa với nội dung biến sẽ chứa
Chữ cái đầu tên trong cụm từ tạo tên biến nên là chữ thường và các chữ cái đầu tiên trong các từ còn là chữ hoa

c) In ra giá trị của Biến

Để xuất ra giá trị của Biến chúng ta sử dụng cú pháp sau:

document.write(tenBien);

II – CÁC KIỂU DỮ LIỆU TRONG JAVASCRIPT

1 – Dữ liệu kiểu Nguyên (Interger)

Dữ liệu kiểu Nguyên là các chữ số thuộc hàng Số Nguyên trong số học

2 – Dữ liệu kiểu Thực (Float)

Dữ liệu kiểu Thực là các chữ số thuộc hàng Số Thực trong toán học Đại Số

3 – Dữ liệu kiểu Chuỗi (String)

Kiểu chuỗi được biểu diễn bởi không hay nhiều ký tự được đặt trong cặp dấu "... " hay '... '

4 – Dữ liệu kiểu Logic (Boolean)

Kiểu logic được sử dụng để chỉ hai điều kiện : đúng hoặc sai. Miền giá trị của kiểu này

chỉ có hai giá trị

true
false

B – THỰC HÀNH

I – BÀI TẬP THỰC HÀNH

Bài 1:

Lấy ví dụ về 2 cách đặt tên một Biến hợp lệ và 3 ví dụ về cách đặt tên một biến sai quy tắc

Mỗi một cách phải thể hiện được đặc trưng của nó so với các cách còn lại
Các cách phải bao quát được toàn bộ Quy tắc đặt tên cho Biến

Bài 2:

Thưc hiện khai báo 4 Biến đồng thời gán giá trị thể hiện với 4 kiểu dữ liệu tương ứng. sau đó in các giá trị của biến ra trình duyệt với mỗi giá trị nằm trên một dòng

II – BÀI TẬP VỀ NHÀ

Bài 3:

Sử dụng toàn bộ các kiến thức đã được học về Javascript để hoàn thành một mẫu thiết kế như trong file bài giải bai_tap_3.html

Bài 4:

Xuất ra trình duyệt bảng biểu như hình dưới với yêu cầu tất cả mã HTML phải nằm trong vùng làm việc của Javascript

<script language=”javascript”> /* Thực hiện yêu cầu */ </script>
Dữ liệu kiểu chuỗi phải để trong cặp dấu nháy kép
Giá trị tương ứng của các thuộc tính trong Table cũng phải đặt trong cặp dấu nháy kép

Hướng dẫn giải bài 2:

<html>

<head><title>Bai 12 --> Bai tap 2.html</title>

</head>

<body>

<script language="javascript">

var bienKieuNguyen = 2012;

var bienKieuThuc = 201.2;

var bienKieuChuoi = "Hai Không Mười Hai";

var bienKieuLogic = true;

var tongHop = bienKieuNguyen + "<br>" + bienKieuThuc + "<br>" + bienKieuChuoi + "<br>" + bienKieuLogic;

document.write(tongHop);

</script>

</body>

</html>

Hướng dẫn giải bài 3:

<html>

</head>

<body>

var hoTen = prompt("Bạn vui lòng nhập vào Họ và Tên đầy đủ xuống dưới!");

var tuoi = prompt("Bạn vui lòng nhập vào Tuổi của bạn xuống dưới!");

var gioiTinh = prompt("Bạn vui lòng nhập vào Giới Tính của bạn xuống dưới!");

var diaChi = prompt("Bạn vui lòng nhập vào Địa Chỉ của bạn xuống dưới!");

var soDienThoai = prompt("Bạn vui lòng nhập vào Số Điện Thoại của bạn xuống dưới!");

var tongHop = hoTen + "<br>" + tuoi + "<br>" + gioiTinh + "<br>" +diaChi + "<br>" + soDienThoai;

document.write(tongHop);

</script>

</body>

</html>

Hướng dẫn giải bài 4:

<html>

</style>

</head>

<body>

document.write("<table width=\"300px\" border=\"1px\" align=\"center\"><tr><td colspan=\"2\" align=\"center\" bgcolor=\"#00FF00\">Các thông số của Table</td></tr><tr><td width=\"75%\" bgcolor=\"#FFFF00\">Chiều rộng</td><td bgcolor=\"#CCFF00\">300px</td></tr><tr><td bgcolor=\"#FFFF00\">Độ rộng cột trái</td><td bgcolor=\"#CCFF00\">75%</td></tr><tr><td bgcolor=\"#FFFF00\">Độ rộng cột phải</td><td bgcolor=\"#CCFF00\">25%</td></tr></table>");

</script>

</body>

</html>

>>Xem bài trước: Bài 14 - Nhập môn javascript

>>Xem bài tiếp theo: Bài 16 - Toán tử trong javascript