Nâng lên(hoisting) là hành vi mặc định của JavaScript khi di chuyển các khai báo lên đầu.
Trong JavaScript, một biến có thể được khai báo sau khi nó đã được sử 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ả giống với ví dụ 2:
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x; // Display x in the element
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x; // Display x in the element
var x; // Declare x
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x; // Display x in the element
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x; // Display x in the element
</script>
</body>
</html>
Để hiểu được điều này, bạn phải hiểu thuật ngữ "nâng lên(hoisting)".
Nâng lên(hoisting) là một hành động mặc định của việc di chuyển các khai báo lên trên đầu của phạm vi hiện tại (đến đầu của tập lệnh hiện tại hoặc hàm hiện tại).
Các biến và các hằng được khai báo với let
hoặc const
sẽ không được nâng lên!
Đọc nhiều hơn về let và const trong JavaScript Let/Const.
JavaScript chỉ nâng lên các khai báo, không phải các khởi tạo.
Ví dụ 1 không cho kết quả giống với ví dụ 2:
var x = 5; // Initialize x
var y = 7; // Initialize y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = 5; // Initialize x
var y = 7; // Initialize y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
</script>
</body>
</html>
var x = 5; // Initialize x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
var y = 7; // Initialize y
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = 5; // Initialize x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = "x is " + x + " and y is " + y; // Display x and y
var y = 7; // Initialize y
</script>
</body>
</html>
Nó có ý nghĩa gì không nếu y là undefined trong ví dụ cuối cùng?
Điều này bởi vì chỉ có sự khai báo (var y), không phải sự khởi tạo (=7) được nâng lên đầu.
Bởi vì sự nâng lên, y đã được khai báo trước khi nó được dùng, nhưng bởi vì sự khởi tạo không được nâng lên, giá trị của y là undefined.
Ví dụ 2 được viết giống thế này:
var x = 5; // Initialize x
var y; // Declare y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
y = 7; // Assign 7 to y
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x = 5; // Initialize x
var y; // Declare y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
y = 7; // Assign 7 to y
</script>
</body>
</html>
Nâng lên (đối với nhiều nhà phát triển) là một hành vi chưa biết hoặc bị bỏ qua của JavaScript.
Nếu nhà phát triển không hiểu về nâng lên, chương trình có thể chứa các lỗi.
Để tránh các lỗi, luôn khai báo tất cả các biến ở đầu của mỗi phạm vi.
Từ khi đây là cách mà JavaScript giải mã code, nó luôn là một quy tắc tốt.
JavaScript trong chế độ nghiêm ngặt(strict) không cho phép các biến được sử dụng nếu nó chưa đựa khai báo.
Học về "dùng strict" trong chương sau.
Ứng Dụng Học
Theo dõi cập nhật nội dung học trên Youtube & Facebook
Thông Tin Liên Hệ
Công Ty Cổ Phần Phát Triển Công Nghệ Gozic.
Website: https://gozic.vn
SĐT: 096 - 70 25 996
Email: ziczacgroup@gmail.com
Thiết kế webiste chuyên nghiệp
Thiết kế phần mềm quản trị
Thiết kế ứng dụng Android
Thiết kế ứng dụng IOS
Thiết kế Web App
Hỗ trợ Digital Marketing
Hỗ trợ quảng cáo Google Ads
Hỗ trợ quảng cáo Facebook Ads
Hỗ trợ SEO Website