ECMAScript 2021 中的全局属性 globalThis 详解

在 ECMAScript 2021 中,新增了一个全局属性 globalThis,它提供了一个标准的方式来获取全局对象。在浏览器环境中,全局对象为 window,而在 Node.js 环境中,全局对象为 global。使用 globalThis 可以让我们在不同的环境中获取全局对象,而不需要关心当前代码运行的环境。

globalThis 的使用

globalThis 是一个只读属性,它可以直接在全局作用域中访问。以下是获取全局对象的三种方式:

-- -- -----
--------------------

-- -- - ------- -
--------------------

-- -- -- ----------
------------------------

在浏览器环境中,以上三种方式都可以获取到全局对象 window。在 Node.js 环境中,以上三种方式都可以获取到全局对象 global。但是,使用 globalThis 可以让我们在不同的环境中获取全局对象,而不需要关心当前代码运行的环境。

globalThis 的应用场景

globalThis 的应用场景很多,以下是一些常见的应用场景。

在 Web Worker 中获取全局对象

Web Worker 是一种运行在后台线程中的 JavaScript 脚本。它可以让我们在浏览器中开启一个新的线程来执行 JavaScript 代码,这样就可以避免阻塞主线程。在 Web Worker 中,全局对象为 self,但是我们可以使用 globalThis 来获取全局对象。

-- - --- ------ -------
------------------------

在跨域的 iframe 中获取全局对象

在跨域的 iframe 中,我们无法使用 window.parent 或 top 来获取全局对象,因为这些属性只能访问同域的父窗口或顶级窗口。但是,我们可以使用 globalThis 来获取全局对象。

-- ---- ------ -------
------------------------

在不同的 JavaScript 运行环境中共享全局变量

在不同的 JavaScript 运行环境中,全局变量的名称可能不同,但是我们可以使用 globalThis 来获取全局对象,并通过全局对象来访问全局变量。

-- -----
---------- - ------

-- - ------- -
---------- - ------

-- ---- ---------- -----------
---------------------------- -- ---

总结

globalThis 是 ECMAScript 2021 中新增的全局属性,它提供了一个标准的方式来获取全局对象。使用 globalThis 可以让我们在不同的 JavaScript 运行环境中获取全局对象,而不需要关心当前代码运行的环境。globalThis 的应用场景很多,特别是在 Web Worker 和跨域的 iframe 中。我们可以通过全局对象来访问全局变量,从而在不同的 JavaScript 运行环境中共享全局变量。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65de62b41886fbafa4bae63f