JavaScript Scope - Pham vi JavaScript

by GokiSoft.Com - 09:54 19/05/2020 2,908 Lượt Xem

Short URL: https://gokisoft.com/1365

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.

Ứ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

Tags:

javascript khoa hoc javascript khóa học javascript tài liệu javascript

Bình luận

Tôi muốn xem code từ thành viên khác

Tài Liệu Tham Khảo

Ứng Dụng Tiện Ích

MD5 Chuyển Đổi Chữ Hoa - UpperCase JSON Editor Coding Online Database Diagram Fake API Base64

Tài Liệu Học

Khai báo biến & hàm mặc định trong Javascript

Mệnh đề điều kiện

Vòng lặp for, while, do..while

Array & Function & Object

Xử lý sự kiện & thao tác thẻ HTML

Lưu trữ Javascript

Examination & Ôn Tập Tổng Quát