Javascript 简明教程
JavaScript - Global Variables
JavaScript Global Variables
JavaScript 中的 global variables 是在函数或任何特定代码块之外定义的变量。可以从 JavaScript 代码中的任何位置访问它们。所有脚本和函数都可以访问全局变量。
可以使用 var、let 或 const 关键字定义全局变量。如果不使用任何 var、let 或 const 关键字定义变量，则该变量会自动成为全局变量。
JavaScript Global Scope
全局变量具有全局范围。因此，在函数或代码块之外声明的变量具有全局范围。可以在所有其他范围内看到或访问 global scope 。在客户端 JavaScript 中，全局范围是执行所有代码的网页。使用 var 关键字声明的全局变量属于 window 对象。
var x = 10; // Global Scope
let y = 20; // Global Scope
const z = 30; // Global Scope在此处，变量 x、y 和 z 在任何函数和代码块之外声明，因此它们具有全局范围，称为全局变量。
Global Variable Examples
让我们使用下面的示例进一步了解全局变量。
Example
我们在下面的代码中已经定义了 x，y，和 z 全局变量。你可以看到代码中的任何地方都可以访问变量。
<html>
<head>
<title> JavaScript - Global variables </title>
</head>
<body>
<p id = "output"> </p>
<script>
var x = 10;
let y = 20;
const z = 30;
document.getElementById("output").innerHTML =
"x = " + x + "<br>" +
"y = " + y + "<br>" +
"z = " + z;
</script>
</body>
</html>x = 10
y = 20
z = 30Example
在下面的示例中，我们已经使用 var 和 let 关键字定义了变量 a 和 b。你可以看到在函数内部或函数外部都可以访问变量 a 和 b，因为它们是全局变量。
<html>
<head>
<title> JavaScript - Global variables </title>
</head>
<body>
<p id = "demo"> </p>
<script>
const output = document.getElementById("demo");
var a = 10;
let b = 20;
function test() {
output.innerHTML += "a -> Inside the function = " + a + "<br>";
output.innerHTML += "b -> Inside the function = " + b + "<br>";
}
test();
output.innerHTML += "a -> Outside the function = " + a + "<br>";
output.innerHTML += "b -> Outside the function = " + b + "<br>";
</script>
</body>
</html>a -> Inside the function = 10
b -> Inside the function = 20
a -> Outside the function = 10
b -> Outside the function = 20Automatic Global Variables
当你在代码中的任何地方定义变量而不使用 var ， let 或 const 关键字时，变量将自动变成 global variable 并可以在代码中的任何地方访问。
Example
在下面的代码中，我们在函数中没有使用任何关键字而定义了变量 'a'。即使我们已经在函数中定义了变量，它依然变成全局变量，因为我们没有使用任何关键字来定义函数。
输出表明，可以在函数内部或外部访问变量 'a'。
<html>
<head>
<title> JavaScript - Global variables </title>
</head>
<body>
<p id = "demo"> </p>
<script>
const output = document.getElementById("demo");
function test() {
a = 90;
output.innerHTML += "a -> Inside the function = " + a + "<br>";
}
test();
output.innerHTML += "a -> Outside the function = " + a + "<br>";
</script>
</body>
</html>a -> Inside the function = 90
a -> Outside the function = 90