Khai Báo Biến Trong Javascript ES6 Có Gì Khác Biệt

Nếu như trong những ngôn ngữ lập trình C, C++, C#, Java cần phải khai báo kiểu dữ liệu của biến, thì Javascript không cần quan tâm đến việc đó, việc khai báo biến chỉ đơn giản như thế này.

Có thể thấy để khai báo biến chỉ cần sử dụng 1 trong 3 từ khóa var, let, const. Kiểu dữ liệu tự động xác định khi chương trình thực thi. Chính vì sự đơn giản như vậy nên phát sinh ra một số vấn đề xoay quanh 3 từ khóa đó.

1. Khai báo lại

Việc khai báo lại một biến trùng tên trong Javascript là có thể nếu sử dụng từ khóa var, nhưng với let và const thì không được.

Nếu khai báo như thế này sẽ lỗi.

2. Hoisting

Hoisting là khái niệm chỉ việc mọi khai báo biến sẽ được đưa lên trên cùng của hàm.

Trong Javascript ES6, khái niệm Hoisting chỉ tồn tại khi khai báo biến với từ khóa var, không tồn tại với let và const.

Khi console.log() một biến chưa được khai báo trước đó thì chương trình sẽ tìm kiếm biến có cùng tên được khai báo với từ khóa var và đưa lên đầu hàm. Tương tự như thế này.

Kết quả in ra sẽ là undefined. 

Nhưng đối với let và const không có khái niệm Hoisting.

Khi chạy thì chương trình sẽ báo lỗi.

3. Block scope

Block scope có nghĩa là phạm vi hoạt động của một biến trong phạm vi hai dấu {} (if, for)

Đối với từ khóa let và const thì phạm vi hoạt động chỉ tồn tại trong block, chúng ta cùng xem các ví dụ sau.

Kết quả in ra như sau.

Nhưng với const và let thì chỉ tồn tại trong block, ở bên ngoài block thì không tồn tại.

Chương trình sẽ báo lỗi

4. Callback

Khi sử dụng callback trong một vòng lặp, nếu khai báo biến mà không chú ý từ khóa thì sẽ phát sinh vấn đề, chúng ta cùng xét ví dụ sau.

VD: Viết chương trình sau 0.5 giây in ra những số nguyên từ 0 đến 4.

Theo cách nghĩ thông thường thì nhiều người sẽ không quan tâm đến vấn đề từ khóa khi khai báo biến chạy, chỉ quan tâm vấn đề chính là làm sau để sau 0.5 giây in ra những số nguyên từ 0 đến 4.

Kết quả sau khi chạy chương trình

Chương trình không in ra kết quả như ta mong muốn. Giá trị của biến i trong hàm callback lại là giá trị cuối cùng của vòng lặp.

Cách khắc phục vấn đề này là thay thế từ khóa var thành let.

Và kết quả giống như ta mong muốn.

5. Global object

Khi khai báo biến ở global scope, từ khóa var tạo ra thuộc tính mới cho global object, nhưng với let và const thì không.

Kết quả

Tạm kết

Trên đây là những kiến thức của mình với việc khai báo biến trong Javascript. Hi vọng sẽ có ích với các bạn. Đừng ngần ngại để lại ý kiến đóng góp ở phần bình luận để kiến thức được hoàn chỉnh và sâu hơn nữa nhé các bạn. Cảm ơn các bạn.