Javascript cơ bản

Bài 3: Toán tử trong Javascript

Ở các bài học trước, chúng ta đã tìm hiểu về Kiểu dữ liệu và Phạm vi hoạt động của biến trong Javascript. Tiếp nối bài học này, các bạn sẽ được biết qua về Toán tử trong Javascript được quy ước như thế nào?

Toán tử trong Javascript

Toán tử số học

(Vui lòng bật F12 trên Chrome/Firefox và chuyển sang Tab Console để thấy kết quả)

<script type="text/javascript">
	var a = 10;
	var b = 15;
	var c = 20;
	var d = c - b * a / 2;
	console.log(d);
</script>

Kết quả:

-55

Toán tử trong Javascript đều có sự tương đồng với các ngôn ngữ lập trình khác và vẫn tuân theo quy tắc toán học “Nhân chia trước, cộng trừ sau”.

Các bạn có thể xem chi tiết các toán tử của Javascript như sau:

+	Phép cộng
–	Phép trừ
*	Phép nhân
/	Phép chia
%	Phép chia lấy dư

Toán tử kết hợp

Toán tử kết hợp	Ví dụ viết tắt	Ví dụ đầy đủ
++	a++	a = a + 1
—	a–	a = a – 1
+=	a += 2	a = a + 2
-=	a -= 2	a = a – 2
*=	a *= 2	a = a * 2
/=	a /= 2	a = a / 2
%=	a %= 2	a = a % 2

Toán tử nối chuỗi (String)

<script type="text/javascript">
	var a = "Hello";
	var b = "World!";
	var c = a + " " + b;
	console.log();
</script>

Kết quả:

Hello World!

Sau khi thực hiện dòng lệnh như trên, bạn sẽ thấy cách nối chuỗi trong Javascript được thực hiện như thế nào. Thông qua việc sử dụng toán tử “+” để nối 2 chuỗi lại với nhau. Ở ví dụ bên trên còn cho chúng ta thấy được việc chúng ta không nhất thiết phải lưu trữ trong biến mới có thể nối chuỗi được mà chúng đã có thể viết chuỗi trực tiếp trong Javascript.

Trường hợp ngoại lệ

<script type="text/javascript">
	var a = "Hello" + 5;
	var b = "100" + 5;
	var c = 5 + 10 + "Hello";
	var d = 5 + "Hello" + 10;
	var e = "Hello" + 5 + 10;
	console.log(a);
	console.log(b);
	console.log(c);
	console.log(d);
	console.log(e);
</script>

Kết quả:

Hello5
1005
15Hello
5Hello10
Hello510

Qua 5 ví dụ đơn giản như trên, nếu như chúng ta sử dụng toán tử “+” theo thứ tự “Chuỗi + Số” thì số cũng sẽ được xem là chuỗi và nó sẽ thực hiện thao tác nối chuỗi như bình thường. Tuy nhiên ở ví dụ biến “c” chúng ta sẽ thấy được độ ưu tiên khi sử dụng toán tử là từ trái sang phải, nếu bên trái toán tử “+” và phải của toán tử “+” đều là số thì nó sẽ thực hiện phép tính trước và sau đó dùng toán tử “+” để nối chuỗi với chuỗi phía sau nó. Tương tự các ví dụ còn lại, các bạn hãy tự viết lại để nhìn nhận ra vấn đề rõ ràng hơn.

Toán tử so sánh

>	Lớn hơn
<	Nhỏ hơn
>=	Lớn hơn hoặc bằng
<=	Nhỏ hơn hoặc bằng
==	Bằng
!=	Không bằng
===	Bằng và giống kiểu dữ liệu
!===	Không bằng và không giống kiểu dữ liệu

Toán tử Logic

Toán tử Logic	True (Đúng)	False (Sai)
&&	Cả 2 vế trái và phải đúng	1 trong 2 vế trai hoặc phải sai
\|\|	1 trong 2 vế trái hoặc phải đúng	Cả 2 vế trái và phải sai
!	Phủ định của False	Phủ định của True

Trong bài này, “Toán tử so sánh” và “Toán tử Logic” các bạn nên tham khảo qua. Trong bài Biểu thức trong Javascript, tôi sẽ nói tiếp về các biểu thức “If…Else”, “Switch…case”. Lúc đó các bạn sẽ dần hiểu rõ nó hơn.

Bài 2: Phạm vi hoạt động của biến trong Javascript

Phạm vi hoạt động của biến trong Javascript

Ở bài Tìm hiểu kiểu dữ liệu trong Javascript chúng ta đã được biết qua cách để khai báo và sử dụng Javascript rồi. Trong đó, chúng ta cũng tìm hiểu sơ lược về các kiểu dữ liệu phổ biến bên trong Javascript cũng như đại đa số các ngôn ngữ lập trình khác đều có. Thì trong bài học này, chúng ta sẽ tìm hiểu về phạm vi hoạt động của biến.

Continue reading Bài 2: Phạm vi hoạt động của biến trong Javascript

Bài 1: Tìm hiểu kiểu dữ liệu trong Javascript

Giới thiệu và tìm hiểu kiểu dữ liệu trong Javascript

JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình kịch bản dựa trên đối tượng được phát triển từ các ý niệm nguyên mẫu. Ngôn ngữ này được dùng rộng rãi cho các trang web, nhưng cũng được dùng để tạo khả năng viết script sử dụng các đối tượng nằm sẵn trong các ứng dụng. Nó vốn được phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành JavaScript. Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn Java. .js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript.

Phiên bản mới nhất của JavaScript là phiên bản 1.5, tương ứng với ECMA-262 bản 3. ECMAScript là phiên bản chuẩn hóa của JavaScript. Trình duyệt Mozilla phiên bản 1.8 beta 1 có hỗ trợ không đầy đủ cho E4X – phần mở rộng cho JavaScript hỗ trợ làm việc với XML, được chuẩn hóa trong ECMA-357.

(Theo Wikipedia)

Cách khai báo Javascript

Javascript có thể thực thi thông qua cách viết sau trong HTML:

<script type=”text/javascript”>
	//Đoạn code cần thực thi
	alert(“Hello World!”);
</script>

Đoạn code trên sẽ hiển thị thông báo với dòng chữ “Hello World!” đã được định nghĩa.

Ngoài ra, Javascript còn được thực thi những dòng lệnh thông qua cách triệu gọi file Javascript được viết trước đó và lưu vào một file riêng với định dạng “.js”. Và cách gọi file Javascript sẽ được viết như sau:

<script type="text/javascript" src="http://www.TenWebsite.com/ThuMucChuaFile/TenFile.js"></script>

Câu hỏi: Vậy khi nào thì ta sử dụng cách viết trực tiếp trong HTML, khi nào thì ta nên viết trong file?

Trả lời: Khi cần thực hiện những công việc có quy mô và thời gian thực hiện ngắn thì chúng ta có thể viết trực tiếp trong HTML, nhưng ngược lại thì ta nên viết trong file và lưu lại như vậy sẽ tối ưu hơn.

Biến

Biến được dùng để lưu lại dữ liệu vào bộ nhớ nhằm xử lý một tác vụ nào đó. Và trong Javascript, biến có thể chứa nhiều kiểu dữ liệu khác nhau.

Cú pháp:

(Vui lòng bật F12 trên Chrome/Firefox và chuyển sang Tab Console để thấy kết quả)

<script type="text/javascript">
	var a = 'Hello World!';
	console.log(a);
</script>

Kết quả:

Hello World!

Định nghĩa một biến bằng từ khoá “var” và “tênBiến” và sau đó chúng ta có phép gán là “=” để gán giá trị cho biến vừa đặt.

Lưu ý thứ 1: javascript cho phép đặt tên biến không cần từ khoá “var”. Tuy nhiên, phạm vi hoạt động của tên biến sẽ không giống nhau.
Lưu ý thứ 2: “console.log()” được sử dụng trong các trình duyệt hiện đại sau này (Chrome, Firefox, Opera). Và được xuất ra trong Console chứ không phải trên màn hình trình duyệt.

Kiểu dữ liệu

Kiểu dữ liệu trong Javascript rất đa dạng, vì thế nó cũng ít nhiều gây khó khăn với những người mới khi bước chân sâu vào Javascript.

Kiểu Số:

<script type="text/javascript">
	var a = 5 + 10;
	console.log(a);
</script>

Kết quả:

Kiểu chuỗi:

<script type="text/javascript">
	var a = "Hello World!";
	console.log(a);
</script>

Kết quả:

Hello World!

Kiểu Mảng:

<script type="text/javascript">
	var a = [5, "Hello World!", 10];
	console.log('a[0]: ' + a[0]);
	console.log('a[1]: ' + a[1]);
	console.log('a[2]: ' + a[2]);
</script>

Kết quả:

a[0]: 5
a[1]: Hello World!
a[2]: 10

Kiểu đối tượng:

<script type="text/javascript">
	var giay = {
		color: 'red',
		size: 38,
		quantity: 2
	};
	console.log('Color: ' + giay.color);
	console.log('Size: ' + giay.size);
	console.log('Quantity: ' + giay.quantity);
</script>

Kết quả:

Color: red
Size: 38
Quantity: 2

Sau khi xem qua các kiểu dữ liệu cơ bản, chắc hẳn cũng khiến các bạn đôi phần thích thú về cách sử dụng giá trị bên trong Javascript rồi đúng không nào? Khá giống với cách sử dụng của PHP khi không cần phải định nghĩa chính xác kiểu biến được sử dụng (Integer, Float, Double…) như thế nào. Thay vào đó, chúng ta hoàn toàn có thể gán cho nó bất kể giá trị nào, kể cả một array, object hay thậm chí là function (Vấn đề này sẽ nói ở các bài học sau).

Trong bài sau, chúng ta sẽ đọc tiếp tới bài Phạm vi hoạt động của biến để có thể hiểu rõ hơn về cách sử dụng biến trong Javascript.