Giới thiệu về JavaScript

Mặc dù có tên như vậy, JavaScript chỉ liên quan đến Java ở chỗ cả hai có chung một vài sự tương đồng về cú pháp. Cú pháp của JavaScript trong quá trình phát triển ban đầu là lấy cảm hứng từ cú pháp của Java và được gọi là "LiveScript" khi nào thì lần đầu tiên xuất bản phiên bản beta của Netscape Navigator vào năm 1995, cả hai để phù hợp với một số các sản phẩm/dịch vụ có tên khác của Netscape và minh hoạ cho sự thật rằng nó đang hoạt động "trực tiếp" trong trình duyệt. Microsoft đã phát hành cách triển khai JavaScript của riêng họ, "JScript" ngay sau đó với Internet Explorer 3.0.

Netscape đã gửi tác phẩm sớm này tới Ecma International, một tổ chức phát triển và xuất bản các tiêu chuẩn kỹ thuật để chính thức hoá và trình bày chi tiết cách các tiêu chuẩn này ngôn ngữ tập lệnh phải được hiểu bởi các trình duyệt khác. Năm 1997, Ecma ECMA-262 được phát hành quốc tế, chuẩn hoá phiên bản đầu tiên của tập lệnh có tên là ECMAScript. ECMAScript là tiêu chuẩn thông báo việc tạo ngôn ngữ tập lệnh cụ thể hơn, ví dụ: sau này Microsoft nghiên cứu JScript hiện không còn tồn tại, bản thân ActionScript và JavaScript của Adobe.

Sự khác biệt này có ý nghĩa quan trọng khi thảo luận về những khía cạnh và đặc điểm cụ thể của JavaScript. "ES5" đề cập đến phiên bản chính đầu tiên "được tạo phiên bản" bản phát hành của Tiêu chuẩn ECMAScript vào năm 2009, sau nhiều năm phát triển nhiều từng phần hơn. "ES6" (hoặc "ES2015") là viết tắt của các tiêu chuẩn do phiên bản thứ sáu của ECMAScript, được phát hành vào năm 2015. Sau ES6, các phiên bản mới của ECMAScript bản chuẩn được phát hành hằng năm, kèm theo những thay đổi và bổ sung của từng ấn bản tham chiếu theo năm như trong "ES2016" hoặc "ES2017".

Quy tắc cơ bản

Không giống như các ngôn ngữ biên dịch, JavaScript không được dịch từ mã do người viết sang một dạng thức mà trình duyệt có thể hiểu được. Một tập lệnh được gửi đến trình duyệt cùng với các thành phần như đánh dấu, hình ảnh và biểu định kiểu, trình duyệt sẽ diễn giải các giống như cách nó được viết: dưới dạng một chuỗi ký tự Unicode mà con người có thể đọc được, được phân tích cú pháp từ trái sang phải và từ trên xuống dưới.

Khi nhận được một tập lệnh, trình thông dịch JavaScript sẽ thực hiện trước tiên phân tích từ vựng, phân tích cú pháp chuỗi ký tự dài tạo thành một tập lệnh và chuyển đổi thành các phần tử đầu vào riêng biệt sau:

• Mã thông báo
• Ký tự điều khiển định dạng
• Dấu ngắt dòng
• Bình luận
• Khoảng trắng (gần như luôn có nghĩa là thẻ và dấu cách).

Kết quả của tập lệnh sẽ không tồn tại sau khi tải lại hoặc điều hướng khỏi trang hiện tại, trừ khi bạn đưa ra hướng dẫn rõ ràng về cách thực hiện khác trong tập lệnh.

Nhìn chung, ứng dụng JavaScript được tạo thành từ các câu lệnh và biểu thức.

Tuyên bố

Câu lệnh là một đơn vị lệnh tạo thành từ một hoặc nhiều dòng mã biểu thị một hành động. Ví dụ: bạn có thể sử dụng câu lệnh sau để gán một giá trị cho biến có tên myVariable:

let myVariable = 4;

myVariable;
> 4

Để được diễn giải chính xác, các câu lệnh phải kết thúc bằng dấu chấm phẩy. Tuy nhiên, những không phải lúc nào cũng bắt buộc phải có dấu chấm phẩy khi viết JavaScript. Một tính năng được gọi tự động chèn dấu chấm phẩy cho phép một dòng ngắt sau một câu lệnh hoàn chỉnh được xem là dấu chấm phẩy nếu thiếu dấu chấm phẩy sẽ gây ra lỗi.

ASI là sửa lỗi, không phải là một khía cạnh được phép của JavaScript. Bởi vì việc phụ thuộc quá nhiều vào việc sửa lỗi này có thể dẫn đến sự không rõ ràng, , bạn vẫn nên kết thúc mọi câu lệnh bằng dấu chấm phẩy.

Chặn tuyên bố

Câu lệnh khối sẽ nhóm số lượng câu lệnh và nội dung khai báo bất kỳ bên trong một cặp trong dấu ngoặc nhọn ({}). API này cho phép bạn kết hợp các câu lệnh ở các vị trí mà JavaScript chỉ mong đợi có một.

Bạn sẽ thường xuyên thấy các câu lệnh chặn bên cạnh luồng điều khiển, chẳng hạn như if:

if ( x === 2 ) {
  //some behavior;
}

Cụm từ

Một biểu thức là một đơn vị mã tạo ra một giá trị, do đó có thể là được sử dụng ở bất kỳ nơi nào giá trị được dự kiến. 2 + 2 là một biểu thức dẫn đến kết quả giá trị 4:

2 + 2;
> 4

"Toán tử nhóm", một cặp dấu ngoặc đơn kèm theo phù hợp, được dùng để nhóm các phần của biểu thức để đảm bảo rằng một phần của biểu thức được được đánh giá dưới dạng một đơn vị duy nhất. Ví dụ: bạn có thể sử dụng toán tử nhóm ghi đè thứ tự toán học của phép toán, hoặc để cải thiện khả năng đọc mã:

2 + 2 * 4;
> 10

( 2 + 2 ) * 4;
> 16

let myVariable = ( 2 + 2 );

myVariable;
> 4

Nhập yếu

JavaScript là một ngôn ngữ được nhập yếu, nghĩa là giá trị dữ liệu không cần để được đánh dấu rõ ràng là một loại dữ liệu cụ thể. Không giống như ngôn ngữ được nhập mạnh, JavaScript có thể suy ra loại dự định từ ngữ cảnh của một giá trị và chuyển đổi giá trị thành loại đó. Quá trình này được gọi là áp dụng loại.

Ví dụ: nếu bạn thêm số vào giá trị chuỗi bằng ngôn ngữ được nhập mạnh, chẳng hạn như Python, kết quả sẽ là một lỗi:

>>> "1" + 1
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: cannot concatenate 'str' and 'int' objects

Thay vì trả về lỗi, JavaScript sẽ ép buộc giá trị số thành một chuỗi và nối hai giá trị, hành vi dự định có nhiều khả năng nhất khi thêm bất kỳ giá trị nào đối với một chuỗi:

"1" + 1;
> "11"

Bạn cũng có thể chuyển đổi rõ ràng các loại dữ liệu. Ví dụ sau đây buộc thực thi giá trị số 100 thành giá trị chuỗi "100" bằng cách sử dụng hàm JavaScript được cài sẵn Phương thức toString:

let myVariable = 100;

typeof myVariable;
> "number"

myVariable = myVariable.toString();
> "100"

typeof myVariable;
> "string"

Có phân biệt chữ hoa chữ thường

Không giống như HTML và phần lớn CSS, bản thân JavaScript hoàn toàn phân biệt chữ hoa chữ thường. Điều này có nghĩa là bạn phải luôn viết hoa mọi thứ một cách nhất quán, từ thuộc tính và phương thức được tích hợp vào ngôn ngữ cho giá trị nhận dạng mà bạn xác định chính bạn.

console.log( "Log this." );
> Log this.

console.Log( "Log this too." );
> Uncaught TypeError: console.Log is not a function

const myVariable = 2;

myvariable;
> Uncaught ReferenceError: myvariable is not defined

myVariable;
> 2

Khoảng trắng

JavaScript không nhạy cảm với khoảng trắng. Điều này có nghĩa là trình thông dịch bỏ qua số lượng và loại (phím tab hoặc dấu cách) của khoảng trắng được sử dụng.

                     console.log(       "Log this"  );console.log("Log this too");
> "Log this."
> "Log this too."

Tuy nhiên, sự hiện diện của khoảng trắng có thể đáng kể như là dấu phân cách giữa mã thông báo từ vựng:

let x;

[mã thông báo: [let] [x] ]

letx;
> Uncaught ReferenceError: letx is not defined

[mã thông báo: [letx] ]

Trong trường hợp khoảng trắng được dùng để phân tách các mã thông báo từ vựng có ý nghĩa, trình phân tích cú pháp bỏ qua số lượng và loại khoảng trắng:

let           x                             =                           2;

[mã thông báo: [let] [x] [=] [2] ]

Điều này cũng đúng với ngắt dòng, mặc dù có những trường hợp ngắt dòng có thể gây ra sự cố do kết thúc sớm một câu lệnh):

let x
=
2;

[mã thông báo: [let] [x] [=] [2] ]

Theo cách nói, một số loại câu thường chiếm một dòng duy nhất:

let x = 1;
let y = 2;

Mặc dù một số câu lệnh thường sử dụng nhiều dòng:

if ( x == 2 ) {
  //some behavior;
}

Tuy nhiên, các quy ước này chỉ nhằm mục đích dễ đọc. JavaScript diễn giải các ví dụ trước theo cách tương tự như sau:

let x=1;let y=2;

if(x==2){}

Do đó, một quy trình tự động sẽ loại bỏ các khoảng trắng không cần thiết khỏi để giảm kích thước truyền là một bước phổ biến để chuẩn bị JavaScript cho môi trường phát hành công khai, cùng với một số điểm tối ưu hoá khác.

Việc sử dụng các ký tự khoảng trắng trong JavaScript phần lớn là vấn đề về tác giả và lựa chọn ưu tiên của người bảo trì. Dự án JavaScript có nhiều nhà phát triển mã đóng góp thường đề xuất hoặc thực thi một số quy ước khoảng trắng nhất định để đảm bảo định dạng mã nhất quán – ví dụ: sử dụng thẻ hoặc dấu cách để thụt lề câu lệnh lồng nhau:

let myVariable = 10;

if ( typeof myVariable === "number" ) {
    console.log( "This variable is a number." );
    if( myVariable > 5 ) {
     console.log( "This variable is greater than five." );
    }
}

> "This variable is a number."
> "This variable is greater than five."

Kiểm tra kiến thức