JavaScript Hoisting

Kéo lên (hoisting) là hành vi mặc định của JavaScript chỉ đến việc các khai báo được kéo lên đầu.

---

Khai báo trong JavaScript được kéo lên

Trong JavaScript, một biến có thể được khai báo sau khi được dùng.

Nói cách khác, một biến có thể sử dụng trước khi nó được khai báo.

Ví dụ 1 cho kết quả tương tự Ví dụ 2:

Ví dụ 1

x = 5; // Gán 5 cho x

elem = document.getElementById("demo"); // Tìm một phần tử
elem.innerHTML = x; // Hiển thị x trong phần tử

var x; // khai báo x

Ví dụ 2

var x; // Khai báo x
x = 5; // Gán 5 cho xelem = document.getElementById("demo"); // Tìm một phần tử
elem.innerHTML = x; // Hiển thị x bên trong phần tử

Để hiểu điều này, bạn cần phải hiểu thuật ngữ “hoisting”.

Hoisting là hành vi mặc định của JavaScript để chuyển tất cả các khai báo lên trên đầu đoạn code hiện tại (lên đầu đoạn mã hiện tại hoặc hàm hiện tại).

---

Khởi tạo JavaScript không được kéo lên

JavaScript chỉ kéo các khai báo, không kéo các giá trị khởi tạo.

Ví dụ 1 không có cùng kết quả với Ví dụ 2:

Ví dụ 1

var x = 5; // Khởi tạo x
var y = 7; // Khởi tạo y
elem = document.getElementById("demo"); // Tìm một phần tử
elem.innerHTML = x + " " + y; // Hiển thị x và y

Ví dụ 2

var x = 5; // Khởi tạo x

elem = document.getElementById("demo"); // Tìm một phần tử
elem.innerHTML = x + " " + y; // Hiển thị x và y

var y = 7; // Khởi tạo y

Tại sao y lại là undefined trong ví dụ cuối cùng?

Điều này là bởi vì chỉ có khai báo (var y), nhưng khởi tạo (=7) không được kéo lên.

Bởi vì hoisting, y được khai báo trước khi sử dụng, nhưng vì khởi tạo không được kéo lên (hoisting), giá trị của y là undefined (không xác định).

Ví dụ 2 có cùng cách viết:

var x = 5; // Khởi tạo x
var y; // Khai báo y
elem = document.getElementById("demo"); // Tìm một phần tử
elem.innerHTML = x + " " + y;           // Hiển thị x và y
y = 7;    // Gán 7 cho y

---

Khai báo các biến của bạn lên trên cùng!

Kéo lên (với nhiều lập trình viên) là không được biết đến hoặc hành vi bị bỏ qua của JavaSript.

Nếu lập trình viên không hiểu hoisting, các chương trình có thể chứa các lỗi.

Để tránh lỗi, luôn luôn khai báo tất cả các biến tại vị trí đầu tiên tại mỗi phạm vi tương ứng.

Đó là cách JavaScript thông dịch, nó luôn là một luật tốt cần tuân theo.

JavaScript trong phiên bản nghiêm ngặt (strict) không cho phép các biến được sử dụng nếu nó không được khai báo.

Chúng ta sẽ học về cách dùng strict trong bài kế tiếp.