Cú pháp lập trình JavaScript (phần 1)

Cú pháp cơ bản của ngôn ngữ JavaScript (JS), bao gồm các cách khai báo biến, các loại dữ liệu và cách viết mã lệnh.

Cú pháp của JavaScript phần lớn được vây mượn từ Java, nhưng JS cũng chịu ảnh hưởng từ cú pháp của các ngôn ngữ lập trình khác như Awk, Perl và Python. JavaScript là ngôn ngữ lập trình sử dụng chuẩn kí tự Unicode và khi viết cũng cần phải lưu ý phân biệt chữ HOA và chữ thường (case-sensitive).

Trong JavaScript, các lệnh (còn gọi là các câu lệnh), được phân tách bằng một dấu chấm phẩy (;). Dấu cách, tab và ký tự dòng mới được gọi là khoảng trắng. Văn bản nguồn của các tập lệnh JavaScript được chuyển đổi thành một chuỗi các yếu tố đầu vào bao gồm các mã giao dịch, ký tự điều khiển, thuật ngữ dòng, nhận xét hoặc khoảng trắng. ECMAScript cũng định nghĩa các từ khóa và chữ cái nhất định và có các quy tắc để “chèn tự động dấu chấm phẩy” (ASI) vào cuối các câu lệnh. Tuy nhiên, bạn nên luôn thêm dấu chấm phẩy để kết thúc câu lệnh của mình; nó sẽ tránh các tác động không mong muốn. Để biết thêm thông tin, hãy xem tài liệu tham khảo chi tiết về ngữ pháp từ vựng của JavaScript.

Trong trang tài liệu HTML:

• Mã JavaScript có thể được đặt trong thẻ HTML

  <script type='text/javascript'>
   	//JavaScript code… 
  </script>

• Hoặc được khai báo việc sử dụng các đoạn mã bên ngoài:

  <script type='text/javascript' src='duong_dan'></script>

Comments

Cú pháp của comments thì giống với C++ và một số ngôn ngữ lập trình khác:

// a one line comment >-- đây là cách comment trên 1 dòng
 
/* this is a longer, cho những dòng dài hoặc nhiều dòng
   multi-line comment. hãy sử dụng kiểu comment này
 */
 
/* You can't, however /* nest comments */ SyntaxError (lỗi cú pháp) */

(Không thể lồng 1 comment trong 1 comment, điều này sẽ gây ra lỗi). Bởi vì:

/* khi bạn mở 1 comment, /* mở comment này 
được tính là 1 phần nằm trong phần comment của bạn, nhưng
khi gặp 1 đóng comment */ <-- lập tức chương trình sẽ hiểu
 cả đoạn trên là một comment.

Biến

Bạn sử dụng biến như là tên tượng trưng cho các giá trị trong chương trình. Tên biến được gọi là identifiers, tuân theo những quy tắc nhất định.

Tên biến phải bắt đầu bằng một ‘chữ cái’, kí tự gạch dưới (_), hoặc kí tự dollar ($); Bạn có thể sử dụng chuẩn ISO 8859-1 hoặc các kí tự Unicode như å và ü trong tên biến, thậm chí cả các kí tự dạng Unicode escape sequences.

Ví dụ: Number_hits, temp99, và _name.

Khai báo biến

Có 3 kiểu khai báo trong JavaScript.

var

Khai báo 1 biến có phạm vi truy cập xuyên suốt function chứa nó.

function foo() { 
	var x = 10; 
	if (true) { 
		var x = 20; // x ở đây cũng là x ở trên
		console.log(x); // in ra 20 
	} 
	console.log(x); // vẫn là 20 
}

let

Khai báo 1 biến chỉ có thể truy cập được trong block bao quanh nó.

function foo() { 
	let x = 10; 
	if (true) { 
		let x = 20; // x này là x khác rồi đấy
		console.log(x); // in ra 20 
	} 
	console.log(x); // in ra 10 
}

const

Khai báo 1 hằng số – là một giá trị không thay đổi được trong suốt quá trình chạy.

const A = 5; 
A = 10; // Lỗi Uncaught TypeError: Assignment to constant variable

Evaluating variables

Một biến được khai báo với cú pháp var hoặc let mà không có giá trị khởi tạo, sẽ có giá trị là undefined.

Khi truy cập vào một biến chưa được khai báo, bạn sẽ nhận được kết quả là: ReferenceError.

var a;
console.log("The value of a is " + a); // logs "Giá trị của a là undefined"
console.log("The value of b is " + b); // throws ReferenceError exception

Bạn có thể sử dụng undefined để xác định một biến có giá trị hay không? Dưới đây là một ví dụ, biến input không được gán giá trị, vậy câu điều kiện if là return true và không chạy vào else.

var input;
if(input === undefined){
	doThis();
} else {
	doThat();
}

Giá trị undefined có thể coi là fasle khi sử dụng trong đối tượng cụ thể, như ví dụ dưới đây, chương trình sẽ chạy function myFunction vì myArray[0] = undefined trả về false.

var myArray = [];
if (!myArray[0]) {
	myFunction();
}

function myFunction() {
	alert('return false');
}

Khi biến có giá trị = undefined thực hiện phép toán với biến có giá trị cụ thể hoặc hằng số sẽ cho ra giá trị = NaN (not a number).

var a;
a + 2 = NaN

Khi bạn xử lý một biến null, giá trị null hoạt động như 0 trong các ngữ cảnh số và là sai trong các ngữ cảnh boolean. Ví dụ:

var n = null;
console.log(n * 32); // Will log 0 to the console

Phạm vi biến

Khi bạn khai báo một biến bên ngoài của bất kỳ hàm nào, nó được gọi là một biến toàn cục, vì nó có sẵn cho bất kỳ mã nào khác trong tài liệu hiện tại. Khi bạn khai báo một biến trong một hàm, nó được gọi là một biến cục bộ, bởi vì nó chỉ có sẵn trong hàm đó.

JavaScript trước ECMAScript 6 không có phạm vi câu lệnh khối; thay vào đó, một biến được khai báo trong một khối là cục bộ cho hàm (hoặc phạm vi toàn cục) mà khối nằm trong đó.

Biến cẩu (Variable hoisting)

Một điều khác thường về các biến trong JavaScript là bạn có thể tham chiếu đến một biến được khai báo sau, mà không mắc phải một ngoại lệ. Khái niệm này được gọi là cẩu (hoisting); các biến trong JavaScript theo nghĩa “hoisted” hoặc được nâng lên đầu của hàm hoặc câu lệnh. Tuy nhiên, các biến chưa được khởi tạo sẽ trả về giá trị undefined.

/**
 * Example 1
 */
console.log(x === undefined); // logs "true"
var x = 3;

/**
 * Example 2
 */
// will return a value of undefined
var myvar = "my value";
 
(function() {
	console.log(myvar); // undefined
	var myvar = "local value";
})();

Do cẩu, tất cả các câu lệnh var trong một hàm nên được đặt ở gần đỉnh của hàm càng tốt. Cách làm tốt nhất này làm tăng độ rõ ràng của mã.

Biến toàn cục

Biến toàn cục là thuộc tính thực tế của đối tượng toàn cục. Trong các trang web, đối tượng toàn cầu là window, vì vậy bạn có thể thiết lập và truy cập các biến toàn cầu bằng cách sử dụng cú pháp window.variable.

Do đó, bạn có thể truy cập các biến toàn cầu được khai báo trong một cửa sổ hoặc khung từ một cửa sổ hoặc khung khác bằng cách chỉ định cửa sổ hoặc tên khung. Ví dụ: nếu biến được gọi là phoneNumber được khai báo trong tài liệu, bạn có thể tham khảo biến này từ iframe dưới dạng parent.phoneNumber.

Constants

Bạn có thể tạo một hằng số chỉ đọc với từ khóa const. Cú pháp của một định danh không đổi giống với một mã định danh biến: nó phải bắt đầu bằng một ký tự, dấu gạch dưới hoặc ký hiệu đô la và có thể chứa các ký tự chữ cái, số hoặc gạch dưới.

const prefix = '212';

Hằng số không thể thay đổi giá trị thông qua câu lệnh hoặc được khai báo lại trong khi tập lệnh đang chạy. Nó phải được khởi tạo thành một giá trị.

Quy tắc phạm vi cho các hằng số giống như các quy tắc cho biến phạm vi khối let. Nếu từ khóa const bị bỏ qua, số nhận dạng được giả định đại diện cho một biến.

Bạn không thể khai báo hằng số có cùng tên với hàm hoặc biến trong cùng phạm vi. Ví dụ:

// THIS WILL CAUSE AN ERROR
function f() {};
const f = 5;

// THIS WILL CAUSE AN ERROR ALSO
function f() {
	const g = 5;
	var g;

	//statements
}

Tham khảo:

• Web APIs: Đối tượng Document
• Web APIs: Đối tượng Node