Giới thiệu về JavaScript

JavaScript chỉ liên quan đến Java ở chỗ hai ngôn ngữ này có một số điểm tương đồng về cú pháp. Cú pháp của JavaScript trong quá trình phát triển ban đầu được lấy cảm hứng từ cú pháp trong Java và nó được gọi là "LiveScript" trong lần đầu xuất bản trong phiên bản beta của Netscape Navigator vào năm 1995, cả hai đều phù hợp với một số sản phẩm có tên khác của Netscape và như một thực tế là nó chạy "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 đó bằng Internet Explorer 3.0.

Netscape đã gửi công việc ban đầu này cho 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à nêu chi tiết cách các trình duyệt khác hiểu ngôn ngữ tập lệnh này. Năm 1997, Ecma International phát hành ECMA-262, chuẩn hoá phiên bản đầu tiên của một ngôn ngữ tập lệnh có tên là ECMAScript. ECMAScript là tiêu chuẩn cung cấp thông tin về việc tạo các ngôn ngữ tập lệnh cụ thể hơn, ví dụ: sau này Microsoft hoạt động trên JScript đã tồn tại, AdX của Adobe và JavaScript.

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

Quy tắc cơ bản

Không giống như ngôn ngữ được biên dịch, JavaScript không được dịch từ mã mà một người viết thành dạng mà trình duyệt có thể hiểu. 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ư mã đánh dấu, hình ảnh và biểu định kiểu. Trình duyệt sẽ diễn giải tập lệnh đó giống như cách 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 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 chuỗi ký tự đó thành các phần tử đầu vào riêng biệt sau đây:

  • 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 (hầu như luôn có nghĩa là các thẻ và khoảng trắng).

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

Ở cấp độ cao, các ứng dụng JavaScript được tạo thành từ các câu lệnhbiểu thức.

Tuyên bố

Câu lệnh là đơn vị hướng dẫn được tạo thành từ một hoặc nhiều dòng mã đại diện cho một thao tác. Ví dụ: bạn có thể sử dụng câu lệnh sau để gán 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, không phải lúc nào bạn cũng bắt buộc phải sử dụng dấu chấm phẩy khi viết JavaScript. Một tính năng có tên là chèn dấu chấm phẩy tự động cho phép dấu ngắt dòng sau một câu lệnh đầy đủ được coi là dấu chấm phẩy nếu thiếu dấu chấm phẩy 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. 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 làm hỏng mã, nên bạn vẫn nên kết thúc mọi câu lệnh theo cách thủ công bằng dấu chấm phẩy.

Chặn câu lệnh

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

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

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

Biểu thức

Một biểu thức (expression) là một đơn vị mã dẫn đến một giá trị và do đó có thể được dùng ở bất cứ nơi nào có giá trị được mong đợi. 2 + 2 là một biểu thức dẫn đến giá trị 4:

2 + 2;
> 4

"Toán tử nhóm", một cặp dấu ngoặc đơn khớp, được dùng để nhóm các phần của biểu thức nhằm đảm bảo rằng một phần của biểu thức được đánh giá là một đơn vị duy nhất. Ví dụ: bạn có thể sử dụng toán tử nhóm để override the mathematical order of operations 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à 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 gọi là cưỡng ép kiểu.

Ví dụ: nếu bạn thêm một số vào giá trị chuỗi bằng ngôn ngữ được nhập mạnh, chẳng hạn như Python, thì kết quả sẽ là 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ẽ buộc giá trị số thành một chuỗi và liên kết hai giá trị đó – đây là hành vi có nhiều khả năng xảy ra nhất khi thêm bất kỳ giá trị nào vào một chuỗi:

"1" + 1;
> "11"

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

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, 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ừ các thuộc tính và phương thức được tích hợp vào ngôn ngữ cho đến các giá trị nhận dạng mà bạn tự xác định.

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: variablename is not defined

myVariable;
> 2

Khoảng trắng

JavaScript không phân biệt khoảng trắng. Điều này có nghĩa là trình phiên dịch sẽ bỏ qua số lượng và loại (thẻ 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ể là yếu tố quan trọng làm dấu phân tách giữa các 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 sẽ 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 dấu 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] ]

Về mặt phong cách, một số loại câu lệnh thường chỉ chiếm một dòng:

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 sẽ 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 đó, quy trình tự động sẽ loại bỏ khoảng trắng không cần thiết khỏi các tệp tập lệnh để giảm kích thước chuyển là một bước phổ biến để chuẩn bị JavaScript cho môi trường sản xuất, cùng với một số hoạt động tối ưu hoá khác.

Việc sử dụng các ký tự khoảng trắng trong JavaScript chủ yếu là vấn đề về lựa chọn ưu tiên về tác giả và người duy trì. Các dự án JavaScript có nhiều nhà phát triển đóng góp mã, thường đề xuất hoặc thực thi một số quy ước khoảng trắng để đảm bảo định dạng mã nhất quán, ví dụ: sử dụng các thẻ hoặc khoảng trắng để thụt lề các 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

Biểu thức là gì?

Đơn vị mã tạo ra một giá trị.
Một nhận xét giải thích hành động của mã.
Một nhóm các câu lệnh và nội dung khai báo.

JavaScript có phân biệt chữ hoa chữ thường.

Đúng
Sai