在 JavaScript 中，全局对象是一个非常重要的概念，它提供了许多常见的属性和方法，比如 window 对象在浏览器中提供了访问页面 DOM 的能力。但是，不同的 JavaScript 环境中，全局对象的名称不一定相同，这给开发者带来了很多麻烦。
为了解决这个问题，ES10 引入了一个新的全局对象 globalThis，它提供了一种可靠的方式来获取全局对象，无论在哪个 JavaScript 环境中。
globalThis 的使用方法
使用 globalThis 很简单，只需要在代码中引用它即可。例如，在浏览器中，可以使用以下代码获取全局对象：
----- ------ - ----------- - ------ ---- -- --- -------------- ----- ------------------ --- ------------ -- ----
在 Node.js 环境中，可以使用以下代码获取全局对象：
------------------ --- ------------ -- ----
globalThis 的深度解析
在深入了解 globalThis 之前，我们先来了解一下 JavaScript 中的全局对象。
JavaScript 中的全局对象
在 JavaScript 中，全局对象是一个特殊的对象，它包含了所有的全局变量和函数。在浏览器中，全局对象是 window 对象，在 Node.js 环境中，全局对象是 global 对象。
全局对象有一个非常重要的作用，它提供了一种方式来访问全局变量和函数。例如，在浏览器中，可以使用 window.alert() 来显示一个警告框，这是因为 alert 函数是全局函数，而 window 对象是全局对象。同样，在 Node.js 环境中，可以使用 global.setTimeout() 函数来设置一个定时器，这是因为 setTimeout 函数是全局函数，而 global 对象是全局对象。
然而，不同的 JavaScript 环境中，全局对象的名称不一定相同。例如，在 Web Worker 中，全局对象是 self，在 Service Worker 中，全局对象是 self 或 globalThis，在 Node.js 中，全局对象是 global。这给开发者带来了很多麻烦。
globalThis 的作用
为了解决全局对象名称不一致的问题，ES10 引入了一个新的全局对象 globalThis。globalThis 是一个可靠的方式来获取全局对象，无论在哪个 JavaScript 环境中。
globalThis 的作用是提供一个标准的方式来获取全局对象，这样开发者就不需要再关心不同 JavaScript 环境中全局对象的名称了。例如，在浏览器中，可以使用以下代码获取全局对象：
---------------------- --- -------- -- ----
在 Node.js 环境中，可以使用以下代码获取全局对象：
---------------------- --- -------- -- ----
globalThis 的兼容性
由于 globalThis 是 ES10 中新增的全局对象，因此在一些老的 JavaScript 环境中可能不支持。为了解决这个问题，可以使用以下代码来兼容不支持 globalThis 的环境：
----- --------- - ---------- -
-- ------- ---- --- ------------ -
------ -----
-
-- ------- ------ --- ------------ -
------ -------
-
-- ------- ------ --- ------------ -
------ -------
-
----- --- ------------- -- ------ ------ ---------
--
----- ------ - ------------
------------------ --- ------------ -- ----这段代码首先检查 self、window 和 global 是否存在，如果存在则返回对应的全局对象，否则抛出一个错误。这样，就可以在不支持 globalThis 的环境中获取全局对象了。
globalThis 的使用示例
下面是一些使用 globalThis 的示例代码。
示例 1：在浏览器中使用 globalThis
--------- -----
------
------
----- ----------------
----------------- ----------
-------
------
--------
----- ------ - -----------
------------------ --- -------- -- ----
---------
-------
-------示例 2：在 Node.js 中使用 globalThis
----- ------ - ----------- ------------------ --- ------------ -- ----
示例 3：在 Web Worker 中使用 globalThis
----- ------ - ----------- ------------------ --- ------ -- ----
示例 4：在 Service Worker 中使用 globalThis
----- ------ - ----------- ------------------ --- ---- -- ------ --- ------------ -- ----
总结
globalThis 是 ES10 中新增的全局对象，它提供了一种可靠的方式来获取全局对象，无论在哪个 JavaScript 环境中。使用 globalThis 可以避免全局对象名称不一致的问题，使代码更加通用和可移植。在实际开发中，我们应该充分利用 globalThis，以提高代码的可靠性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65c9acb6add4f0e0ff37f1cd