JavaScript - 全局变量

上一页
下一页

JavaScript 全局变量

JavaScript 全局（Global）变量是在函数或任何特定块之外定义的变量。它们可以从 JavaScript 代码中的任何位置访问。所有脚本和函数都可以访问全局变量。

您可以使用 var、let 或 const 关键字定义全局变量。在不使用任何 var、let 或 const 关键字的情况下定义的变量将自动成为全局变量。

JavaScript 全局范围

全局（Global）变量具有全局范围。因此，在函数或块之外声明的变量具有全局范围。全局范围在所有其他范围内可见或可访问。在客户端 JavaScript 中，全局范围是执行所有代码的网页。使用 var 关键字声明的全局变量属于 window 对象。


var x = 10; // 全局范围
let y = 20; // 全局范围
const z = 30; // 全局范围

这里变量 x、y 和 z 在任何函数和块之外声明，因此它们具有全局范围，称为全局变量。

全局变量示例

让我们通过下面的示例来了解更多关于全局变量的信息。

例

我们在下面的代码中定义了 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 = 30

例

在下面的示例中，我们使用 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 = 20

自动全局变量

当您在不使用 var、let 或 const 关键字的情况下在代码内的任意位置定义变量时，该变量会自动成为全局变量，并且可以在代码中的任何位置访问。

例

在下面的代码中，我们定义了变量 '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

在 函数 或 特定块 中定义全局变量不是一种好的做法，因为代码中可能会发生命名冲突。

打印本页
上一页
下一页