🔥CHỌN LỌC TOP NHỮNG KHOÁ HỌC LẬP TRÌNH ONLINE NHIỀU NGƯỜI THEO HOC TẠI ĐÂY🔥

Hầu hết thời gian, một ứng dụng JavaScript cần phải làm việc với thông tin. Đây là hai ví dụ:

  1. Một cửa hàng trực tuyến – thông tin có thể bao gồm hàng hóa được bán và giỏ hàng.
  2. Một ứng dụng trò chuyện – thông tin có thể bao gồm người dùng, tin nhắn và nhiều hơn nữa.

Các biến được sử dụng để lưu trữ thông tin này.

1. Một biến(variables)

Một biến là một nới lưu trữ có tên là tên lưu trữ cho dữ liệu nào đó. Chúng ta có thể sử dụng các biến để lưu trữ thông tin, khách truy cập và dữ liệu khác.

Để tạo một biến trong JavaScript, sử dụng từ khóa. let.

Câu lệnh dưới đây tạo ra (nói cách khác: khai báo ) một biến có tên là message.

let message;

Bây giờ, chúng ta có thể đặt một số dữ liệu vào nó bằng cách sử dụng toán tử gán =:

let message;

message = 'Hello'; // store the string

Chuỗi bây giờ được lưu vào vùng nhớ được liên kết với biến. Chúng ta có thể truy cập nó bằng tên biến:

let message;
message = 'Hello!';

alert(message); // shows the variable content

Để ngắn gọn, chúng ta có thể kết hợp khai báo biến và gán thành một dòng duy nhất:

let message = 'Hello!'; // define the variable and assign the value

alert(message); // Hello!

Chúng ta cũng có thể khai báo nhiều biến trong một dòng:

let user = 'John', age = 25, message = 'Hello';

Điều đó có vẻ ngắn hơn, nhưng chúng tôi không khuyên bạn làm điều nó. Để dễ đọc hơn, vui lòng sử dụng một dòng cho mỗi biến.

Biến thể dài hơn một chút, nhưng dễ đọc hơn:

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
*/


let user = 'John';
let age = 25;
let message = 'Hello';

Một số người cũng định nghĩa nhiều biến theo kiểu đa dòng này:

let user = 'John',
  age = 25,
  message = 'Hello';

Hay thậm chí trong phong cách với dấu phẩy:

let user = 'John'
  , age = 25
  , message = 'Hello';

Về mặt kỹ thuật, tất cả các biến thể này đều làm điều tương tự. Vì đó là vấn đề sở thích cá nhân và thẩm mỹ.

var thay vì let

Trong các tập lệnh cũ hơn, bạn cũng có thể tìm thấy một từ khóa khác: varthay vì let:

   var message = 'Hello';

Các từ khóa var gần giống như let. Nó cũng khai báo một biến số, nhưng theo một cách hơi khác, kiểu cũ.

Có sự khác biệt tinh tế giữa letvà var, nhưng chúng không quan trọng đối với chúng ta. Chúng ta sẽ đề cập chi tiết về chúng trong chương sử dụng “var” cũ .

2. Một sự tương tự ngoài đời thực

Chúng ta có thể dễ dàng nắm bắt khái niệm về một biến nếu chúng ta tưởng tượng nó là một hộp dữ liệu với một nhãn được dán có tên duy nhất trên đó.

Chẳng hạn, biến messagecó thể được tưởng tượng như một hộp có nhãn "message" với giá trị "Hello!"trong đó:

Chúng ta có thể đặt bất kỳ giá trị trong hộp.

Chúng ta cũng có thể thay đổi nó nhiều lần như chúng ta muốn:

let message;

message = 'Hello!';

message = 'World!'; // value changed

alert(message);

Khi giá trị được thay đổi, dữ liệu cũ sẽ bị xóa khỏi biến:

Chúng ta cũng có thể khai báo hai biến và sao chép dữ liệu từ cái này sang cái kia.

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
*/


let hello = 'Hello world!';

let message;

// copy 'Hello world' from hello into message
message = hello;

// now two variables hold the same data
alert(hello); // Hello world!
alert(message); // Hello world!

Ngôn ngữ cấu trúc

Thật thú vị khi lưu ý rằng tồn tại các ngôn ngữ lập trình cấu trúc , như Scala hoặc Erlang cấm thay đổi giá trị biến.

Trong các ngôn ngữ như vậy, một khi giá trị được lưu trữ trong hộp, thì nó sẽ tồn tại mãi mãi. Nếu chúng ta cần lưu trữ một cái gì đó khác, ngôn ngữ buộc chúng ta phải tạo một hộp mới (khai báo một biến mới). Chúng ta không thể tái sử dụng cái cũ.

Mặc dù có vẻ hơi kỳ lạ ngay từ cái nhìn đầu tiên, những ngôn ngữ này hoàn toàn có khả năng phát triển thêm nữa. Hơn thế nữa, có những lĩnh vực như tính toán song song trong đó giới hạn này mang lại lợi ích nhất định. Nghiên cứu một ngôn ngữ như vậy (ngay cả khi bạn không có kế hoạch sử dụng nó sớm) được khuyến khích để mở rộng tâm trí.

3. Đặt tên biến

Có hai hạn chế về tên biến trong JavaScript:

  1. Tên phải chỉ chứa các chữ cái, chữ số hoặc ký hiệu $và _.
  2. Ký tự đầu tiên không được là chữ số.

Ví dụ về tên hợp lệ:

let userName;
let test123;

Khi tên chứa nhiều từ, camelCase thường được sử dụng. Đó là: các từ đi nối tiếp nhau, mỗi từ bắt đầu bằng chữ in hoa : myVeryLongName.

Điều thú vị – ký hiệu đô la '$'và dấu gạch dưới '_'cũng có thể được sử dụng trong tên. Chúng là những biểu tượng thông thường, giống như chữ cái, không có bất kỳ ý nghĩa đặc biệt nào.

Những tên này là hợp lệ:

let $ = 1; // declared a variable with the name "$"
let _ = 2; // and now a variable with the name "_"

alert($ + _); // 3

Ví dụ về tên biến không chính xác:

let 1a; // cannot start with a digit

let my-name; // hyphens '-' aren't allowed in the name

Vấn đề

Các biến được đặt tên applevà AppLElà hai biến khác nhau. Các chữ cái không phải là tiếng Latinh được cho phép, nhưng không được đề xuất để dùng

Có thể sử dụng bất kỳ ngôn ngữ nào, bao gồm các chữ cái cyrillic hoặc thậm chí chữ tượng hình, như thế này:

let имя = '...';
let 我 = '...';

Về mặt kỹ thuật, không có lỗi ở đây, những tên như vậy được cho phép, nhưng có một truyền thống chung là sử dụng tiếng Anh trong tên biến. Ngay cả khi chúng ta đang viết một kịch bản nhỏ, nó có thể có một quá trình luyện code lâu dài phía trước.

Tên dành riêng

Có một danh sách các từ dành riêng, không thể được sử dụng làm tên biến vì chúng được sử dụng bởi chính ngôn ngữ.

Ví dụ: let, class, return, và functionđược dành riêng.

Code dưới đây đưa ra một lỗi cú pháp:

let let = 5; // can't name a variable "let", error!
let return = 5; // also can't name it "return", error!

Gán không có use strict

Thông thường, chúng ta cần khai báo một biến trước khi sử dụng nó. Nhưng trong thời đại cũ, về mặt kỹ thuật có thể tạo ra một biến bằng cách gán giá trị đơn thuần mà không cần sử dụng let. Điều này vẫn hoạt động ngay bây giờ nếu chúng ta không đưa use strictvào các tập lệnh của mình để duy trì khả năng tương thích với các tập lệnh cũ.

// note: no "use strict" in this example

num = 5; // the variable "num" is created if it didn't exist

alert(num); // 5

Đây là một thực tiễn xấu và sẽ gây ra lỗi trong chế độ nghiêm ngặt:

"use strict";

num = 5; // error: num is not defined

4. Hằng số

Để khai báo một biến không đổi (không thay đổi), sử dụng constthay vì let:

const myBirthday = '18.04.1982';

Các biến được khai báo sử dụng constđược gọi là các hằng số. Nó không thể được chỉ định lại giá trị. Một nỗ lực để làm như vậy sẽ gây ra lỗi:

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, can't reassign the constant!

Khi một lập trình viên chắc chắn rằng một biến sẽ không bao giờ thay đổi, họ có thể khai báo nó constđể đảm bảo và truyền đạt rõ ràng thực tế đó cho mọi người.

5. Hằng số in hoa

Có một thực tiễn phổ biến để sử dụng các hằng số làm bí danh cho các giá trị khó nhớ được biết trước khi thực hiện.

Các hằng số như vậy được đặt tên bằng chữ in hoa và dấu gạch dưới.

Chẳng hạn, hãy tạo các hằng số cho các màu theo định dạng được gọi là HEX (thập lục phân):

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
*/


const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ...when we need to pick a color
let color = COLOR_ORANGE;
alert(color); // #FF7F00

Những lợi ích:

  • COLOR_ORANGElà dễ dàng hơn để nhớ hơn "#FF7F00".
  • Nó dễ dàng gõ nhầm "#FF7F00"hơn là COLOR_ORANGE.
  • Khi đọc code, COLOR_ORANGEcó ý nghĩa hơn nhiều #FF7F00.

Khi nào chúng ta nên sử dụng chữ viết hoa cho một hằng số và khi nào chúng ta nên đặt tên bình thường?

Hãy làm rõ điều đó.

Là một hằng số chỉ có nghĩa là giá trị của một biến không bao giờ thay đổi. Nhưng có các hằng số được biết trước khi thực hiện (như giá trị thập lục phân cho màu đỏ) và có các hằng số được tính theo thời gian chạy, trong khi thực hiện, nhưng không thay đổi sau khi gán ban đầu.

Ví dụ:

const pageLoadTime = /* time taken by a webpage to load */;

Giá trị của pageLoadTimekhông được biết trước khi tải trang, vì vậy nó được đặt tên bình thường. Nhưng nó vẫn không đổi vì nó không thay đổi sau khi gán.

Nói cách khác, các hằng số có tên vốn chỉ được sử dụng làm bí danh cho các giá trị cứng được mã hóa cứng – không thay đổi.

6. Đặt tên đúng

Nói về các biến, có một điều cực kỳ quan trọng.

Một tên biến phải có ý nghĩa rõ ràng, mô tả dữ liệu mà nó lưu trữ.

Đặt tên biến là một trong những kỹ năng quan trọng và phức tạp nhất trong lập trình. Nhìn lướt qua các tên biến có thể tiết lộ code nào được viết bởi người mới bắt đầu so với developer có kinh nghiệm.

Trong một dự án thực tế, phần lớn thời gian được dành cho việc sửa đổi và mở rộng cơ sở code hiện có thay vì viết một cái gì đó hoàn toàn tách biệt khỏi đầu. Khi chúng tôi trở lại một số code sau khi làm một việc khác, việc tìm kiếm thông tin được dán nhãn tốt sẽ dễ dàng hơn nhiều. Hay nói cách khác, khi các biến có tên tốt.

Hãy dành thời gian suy nghĩ về tên đúng cho một biến trước khi khai báo nó. Làm như vậy sẽ trả ơn bạn rất nhiều.

Một số quy tắc tốt để tuân theo là:

  • Sử dụng tên người có thể đọc được như userNamehoặc shoppingCart.
  • Tránh xa các chữ viết tắt hoặc tên ngắn như a, b, c, trừ khi bạn thực sự biết những gì bạn đang làm.
  • Đặt tên mô tả tối đa và súc tích. Ví dụ về tên xấu là datavà value. Những cái tên như vậy không nói gì. Chỉ sử dụng chúng nếu bối cảnh của code làm cho nó đặc biệt rõ ràng về dữ liệu hoặc giá trị nào mà biến đang tham chiếu.
  • Đồng ý với các điều khoản trong nhóm của bạn và trong tâm trí của riêng bạn. Nếu một khách truy cập trang web được gọi là người dùng trên mạng, thì chúng ta nên đặt tên cho các biến liên quan currentUserhoặc newUserthay vì currentVisitorhoặc newManInTown.

Nghe có vẻ đơn giản? Thật vậy, nhưng tạo ra các tên biến mô tả súc tích trong thực tế thì không. Cứ liều thử đi.

Tái sử dụng hay tạo ra?

Và lưu ý cuối cùng. Có một số lập trình viên lười biếng, thay vì khai báo các biến mới, có xu hướng sử dụng lại các biến hiện có.

Kết quả là, các biến của chúng giống như các hộp mà mọi người ném những thứ khác nhau mà không thay đổi nhãn dán của họ. Những gì bên trong hộp bây giờ? Ai biết? Chúng ta cần đến gần hơn và kiểm tra.

Các lập trình viên như vậy tiết kiệm một chút khi khai báo biến nhưng mất hơn mười lần khi gỡ lỗi.

Một biến phụ là tốt, không xấu.

Các trình khai thác và trình duyệt JavaScript hiện đại tối ưu hóa code đủ tốt, do đó nó sẽ không tạo ra các vấn đề về hiệu suất. Sử dụng các biến khác nhau cho các giá trị khác nhau thậm chí có thể giúp công cụ tối ưu hóa code của bạn.

7. Tóm lược

Chúng ta có thể khai báo các biến để lưu trữ dữ liệu bằng từ khóa var, lethoặc const

  • let – là một khai báo biến hiện đại.
  • var– là một khai báo biến trường cũ. Thông thường chúng tôi hoàn toàn không sử dụng nó, nhưng chúng tôi sẽ đề cập đến những khác biệt tinh tế lettrong chương sử dụng “var” cũ , chỉ trong trường hợp bạn cần chúng.
  • const– là như let, nhưng giá trị của biến không thể thay đổi.

Các biến nên được đặt tên theo cách cho phép chúng ta dễ dàng hiểu những gì bên trong chúng.

Đăng ký kênh youtube để ủng hộ Cafedev nha các bạn, Thanks you!

BÀI VIẾT LIÊN QUANXEM THÊM