JavaScript - 全局对象

JavaScript 中的全局对象

JavaScript 全局对象允许您访问在全局范围内定义且在代码中随处可见的变量、函数、对象等。

在浏览器中，全局对象命名为 'window'，而在 Node.js 中，全局对象命名为 'global'。但是，全局对象在不同的运行时环境中可能具有不同的名称。

“globalThis”已在 ECMAScript 2020 中引入，它作为全局对象适用于大多数浏览器和运行时环境。

语法

我们可以按照下面的语法来使用全局对象来访问 JavaScript 代码中随处可见的变量。


var a = 10;
let b = window.a; // 在浏览器中访问全局变量

在上述语法中，变量 'a' 是全局变量，因为它是在全局范围内使用 var 关键字定义的。

例子

示例：通过全局对象访问全局变量

在下面的示例中，我们使用 var 关键字在全局范围内定义了 'name' 变量。之后，我们使用 window （global）对象访问 name 变量。


<html>
<body>
	 	<div id = "output">The company name is: </div>
	 	<script>
	 	 	 var name = "qikepucom";
	 	 	 let company = window.name;
	 	 	 document.getElementById("output").innerHTML += company;
	 	</script>
</body>
</html>

输出

The company name is: qikepucom

同样，如果您在全局范围内定义函数，则可以使用全局对象在任何位置访问它。

示例：通过全局对象访问 global 函数

在下面的示例中，我们在全局范围内定义了 sum（）函数。之后，我们定义了包含 num1、num2 和 sum 属性的 obj 对象。sum 属性使用 sum（）函数返回的值进行初始化。我们使用 ' window' 对象来调用全局 sum（）函数。

因此，您可以使用全局对象在 JavaScript 代码中的任何位置访问全局变量和实例。


<html>
<body>
	 	<p id = "output"> </p>
	 	<script>
	 	 	 function sum(a, b) {
	 	 	 	 	return a + b;
	 	 	 }
	 	 	 		
	 	 	 const obj = {
	 	 	 	 	num1: 10,
	 	 	 	 	num2: 20,
	 	 	 	 	sum: window.sum(10, 20),
	 	 	 }
	 	 	 		
	 	 	 document.getElementById("output").innerHTML += "The object is: " + JSON.stringify(obj);
	 	</script>
</body>
</html>

输出

The object is: {"num1":10,"num2":20,"sum":30}

如果你想让值从本地范围全局访问，你可以直接将值作为属性添加到 'window' 对象中。

让我们看看下面的示例。

示例：使变量可从函数范围全局访问

在下面的示例中，我们将 'addition' 属性添加到 sum（）函数体中的 window 对象，使其在任何地方都可用。

之后，我们使用 'window' 对象访问 'addition' 属性。


<html>
<body>
	 	<div id = "output"> </div>
	 	<script>
	 		
	 	 	 function sum(a, b) {
	 	 	 	 	window.addition = a + b;
	 	 	 }
	 	 	 sum(20, 30);
	 	 	 document.getElementById("output").innerHTML = "The sum is: " + window.addition;

	 	</script>
</body>
</html>

输出

The sum is: 50

您还可以在不使用全局对象（如窗口）的情况下访问全局变量，因为默认情况下，脚本由 JavaScript 脚本引擎分配给对象下。但是，您可以使用全局对象将变量或表达式设为全局变量或表达式。

JavaScript 全局对象本身包含各种方法，如 isNaN（）、decodeURI（）等。您可以使用浏览器中的 global object-like 窗口和 Node.js 中的 global 窗口来访问它们。

示例：访问全局对象的预定义方法

window 对象的 JavaScript isNaN（）方法用于检查传递的参数是否为数字。如果参数是数字，则返回 false。否则，它将返回 true。


<html>
<body>
	 	<p id = "output"> </p>
	 	<script>
	 	 	 let isNumer = window.isNaN("Hello");
	 	 	 document.getElementById("output").innerHTML = "Is hello not a number? " + isNumer;
	 	</script>
</body>
</html>

输出

Is hello not a number? true

将 JavaScript 全局对象用于 Polyfill

您可以使用 JavaScript 全局对象来检查您的浏览器是否支持特定功能。如果用户的浏览器不支持特定功能，则可以显示相关消息。

查看下面的示例，检查用户的浏览器是否支持 Promise。

例

在下面的代码中，我们检查 window 对象中是否存在 'promise' 属性。如果是，则浏览器支持 Promise，您可以执行 Promise。否则，您可以打印浏览器不支持 promise 的消息。


<html>
<body>
	 	<p id = "output"> </p>
	 	<script>
	 	 	 const output = document.getElementById("output");
	 	 	 if (window.Promise) {
	 	 	 	 	output.innerHTML += "Your browser supports promises";
	 	 	 } else {
	 	 	 	 	output.innerHTML += "Your browser doesn't support promises";
	 	 	 }
	 	</script>
</body>
</html>

输出

Your browser supports promises

JavaScript 全局对象仅存储真正的全局变量。您不应将变量存储在非全局的全局对象中。否则，它可能会在您的项目中产生冲突。

打印本页