JavaScript Scope - Pham vi JavaScript
Phạm vi xác định khả năng truy cập (khả năng hiển thị) của các biến.
Phạm vi hàm JavaScript(JavaScript Function Scope)
Trong JavaScript có hai loại phạm vi:
- Phạm vi địa phương
- Phạm vi toàn cục
JavaScript có phạm vi hàm: Mỗi hàm tạo ra một phạm vi.
Phạm vi xác định khả năng truy cập (khả năng hiển thị) của các biến đó.
Các biến được xác định trong một hàm là không thể truy cập (có thể thấy) từ bên ngoài hàm.
Các biến địa phương JavaScript(Local JavaScript Variables)
Các biến địa phương được khai báo với một hàm JavaScript, trở thành ĐỊA PHƯƠNG(LOCAL) đối với hàm.
Các biến địa phương có phạm vi hàm(fuction scope): Chúng có thể chỉ được truy cập từ bên trong hàm.
ví dụ
// code here can NOT use carName
function myFunction() {
var carName = "Volvo";
// code here CAN use carName
}<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Scope</h2>
<p>Outside myFunction() carName is undefined.</p>
<p id="demo1"></p>
<p id="demo2"></p>
<script>
myFunction();
function myFunction() {
var carName = "Volvo";
document.getElementById("demo1").innerHTML = typeof carName + " " + carName;
}
document.getElementById("demo2").innerHTML = typeof carName;
</script>
</body>
</html>
Từ khi các biến địa phương chỉ được nhận ra bên trong hàm của nó, các biến với cùng tên có thể được sử dụng trong các hàm khác nhau.
Các biến địa phương được tạo khi một hàm bắt đầu, và được xóa khi hàm hoàn thành.
Các biến JavaScript toàn cục(Global JavaScript Variables)
Một biến được khai báo bên ngoài hàm, trở thành TOÀN CỤC(GLOBAL).
Một biến toàn cục có phạm vi toàn cục: Tất cả các dòng lệnh và hàm trên trang web có thể truy cập nó.
ví dụ
var carName = "Volvo";
// code here can use carName
function myFunction() {
// code here can also use carName
}<html>
<body>
<h2>JavaScript Scope</h2>
<p>A GLOBAL variable can be accessed from any script or function.</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
myFunction();
function myFunction() {
document.getElementById("demo").innerHTML = "I can display " + carName;
}
</script>
</body>
</html>
Các biến JavaScipt(JavaScript Variables)
Trong JavaScript, các đối tượng và các hàm đồng thời là các biến.
Phạm vi quyết định khả năng truy cập của biến, đối tượng, và hàm trong các phần khác nhau của code.
Tự động trở thành toàn cục(Automatically Global)
Nếu bạn gán một giá trị cho một biến chưa được khai báo, nó sẽ tự động trở thành một biến toàn cục.
Ví dụ code này sẽ khai báo một biến toàn cục carName, thậm chí nếu giá trị được gán trong một hàm.
ví dụ
myFunction();
// code here can use carName
function myFunction() {
carName = "Volvo";
}<!DOCTYPE html>
<html>
<body>
<p>If you assign a value to a variable that has not been declared, it will automatically become a GLOBAL variable:</p>
<p id="demo"></p>
<script>
myFunction();
// code here can use carName as a global variable
document.getElementById("demo").innerHTML = "I can display " + carName;
function myFunction() {
carName = "Volvo";
}
</script>
</body>
</html>Chế độ nghiêm ngặt(Strict Mode)
Tất cả các trình duyệt hiện đại đều hỗ trợ chạy JavaScript trong "chế độ nghiêm ngặt".
Bạn sẽ học được nhiều hơn về cách làm thế nào để dùng chế độ nghiêm ngặt trong chương sau.
Trong chế độ "nghiêm ngặt(Strict Mode)", các biến chưa được khai báo sẽ không tự động thành toàn cục.
Các biến toàn cục trong HTML(Global Variables in HTML)
Với JavaScript, phạm vi toàn cục là một môi trường JavaScript hoàn thiện.
Trong HTML, phạm vi toàn cục là đối tượng window. Tât cả các biến toàn cục thuộc về đối tượng window(window object).
ví dụ
var carName = "Volvo";
// code here can use window.carName<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Scope</h2>
<p>In HTML, global variables defined with <b>var</b>, will become window variables.</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
// code here can use window.carName
document.getElementById("demo").innerHTML = "I can display " + window.carName;
</script>
</body>
</html>
Cảnh báo
Đừng tạo các biến toàn cục trừ khi bạn định làm thế.
Các biến toàn cục của bạn (hoặc các hàm) có thể ghi đè lên các biến window (hoặc các hàm).
Mọi hàm, bao gồm đối tượng window, có thể ghi đè các biến toàn cục và các hàm của bạn .
Thời gian tồn tại của các biến JavaScript(The Lifetime of JavaScript Variables)
Thời gian tồn tại của một biến JavaScript bắt đầu từ lúc nó được khai báo.
Các biến địa phương bị xóa khi hàm hoàn thành.
Trong một trình duyệt web, các biến toàn cục bị xóa khi bạn tắt cửa sổ trình duyệt (hoặc tab).
Các đối số của hàm(Function Arguments)
Các đối số của hàm (tham số) làm việc như các biến địa phương bên trong hàm.
Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)
