在前端开发中，我们经常需要与浏览器窗口进行交互。为了实现这种交互，我们通常会使用 JavaScript 中的 window 对象，这是一个全局对象，提供了大量的浏览器 API。
但是，在 ES12 标准中，我们发现了一些新的全局对象，例如 globalThis 和 self。这些对象与 window 有什么区别呢？本文将介绍 ES12 中的这些全局对象，并且探讨它们之间的区别。
globalThis
globalThis 是 ES12 标准中新出现的一个全局对象，它被设计成一个可以在任何 JavaScript 环境中获取的全局对象，包括浏览器、Node.js 和 Web Worker。这意味着，不管你的 JavaScript 代码在哪个环境中运行，你都可以通过 globalThis 来访问全局对象。
从标准库的角度来看，globalThis 的作用类似于 window，因为它提供了许多浏览器 API。不同之处在于，window 只在浏览器环境中可用，而 globalThis 可以在浏览器和其他 JavaScript 环境中使用。
下面是一个示例代码，演示了如何使用 globalThis 来访问全局对象：
------------------------ -- -------- -------------- ----- ------
self
self 也是 ES12 标准中新增的一个全局对象，它是一个只读属性，指向当前执行的 WorkerGlobalScope，在非 Worker 环境下等价于 window。如果你不熟悉 Web Worker，可以简单理解为一个运行在后台线程中的 JavaScript 程序。
在浏览器中，如果从主程序中使用 self，它将返回 window 对象。如果从 Worker 中使用 self，它将返回当前的 WorkerGlobalScope 对象。
下面是一个示例代码，演示了如何在 Worker 中使用 self 访问全局对象：
-------------------------------- --------------- - ------------------ -- - ------ ------ -- ----------------- ---
window
window 通常是我们在前端开发中最常用的全局对象之一，因为它在浏览器环境中提供了大量的浏览器 API，例如 document、location 和 history 等。
从本质上讲，window 是 DOM 的根对象，是通过浏览器运行 JavaScript 代码时创建的。在浏览器环境中，window 包含了所有全局变量、函数和对象。这意味着，通过 window，我们可以访问到所有浏览器 API。
下面是一个示例代码，演示了如何在浏览器环境中使用 window 访问全局对象：
-------------------- -- -- ------ --
区别与应用
上面介绍了三个不同的全局对象：globalThis、self 和 window。它们之间的关系和区别如下：
globalThis：是一个可用于访问全局对象的标准库，可以跨浏览器和 Node.js 进行使用。
self：是一个只读属性，指向当前执行的 WorkerGlobalScope，在非 Worker 环境下等价于 window。
window：是浏览器环境中最常见的全局对象，提供了大量的浏览器 API。
在实际应用中，我们应该根据不同的场景选择不同的全局对象。如果在多个 JavaScript 环境中交互，可以使用 globalThis 来访问全局对象。如果需要与 Web Worker 进行交互，可以使用 self 来访问全局对象。而在浏览器环境中，我们通常会使用 window 来访问浏览器 API。
结论
ES12 中的 globalThis、self 和 window 三个全局对象都有着自己的作用和功能，应该在不同的场景中加以使用。
globalThis 是一个可用于访问全局对象的标准库，在任何 JavaScript 环境中都可以使用。
self 是一个只读属性，指向当前执行的 WorkerGlobalScope，在非 Worker 环境下等价于 window。
window 是浏览器环境中最常见的全局对象，提供了大量的浏览器 API。
通过深入了解这些全局对象，我们可以更好地理解 JavaScript 运行时的概念和机制，并且可以更好地选择适当的工具来实现我们的开发需求。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6736e3ad0bc820c58256f190