ES2020：解析全局对象 globalThis 在 JavaScript 如何使用

在 JavaScript 中，全局对象是一个非常重要的概念，它是整个 JavaScript 运行环境中最顶层的对象。在不同的运行环境中，全局对象的名称和属性可能会有所不同，例如在浏览器中，全局对象就是 window，而在 Node.js 中，全局对象就是 global。为了消除这种差异，ES2020 引入了一个新的全局对象 globalThis，它可以在任何 JavaScript 运行环境中使用。

globalThis 的作用

globalThis 的作用非常简单，它提供了一种标准的方式访问全局对象，无论是在浏览器中还是在 Node.js 中，都可以使用 globalThis 来访问全局对象。这样一来，我们就可以编写跨平台的 JavaScript 代码，而不用担心不同平台的全局对象名称不同的问题。

如何使用 globalThis

使用 globalThis 非常简单，只需要在代码中使用 globalThis 来代替全局对象即可。例如，在浏览器中，我们可以使用以下代码来访问全局对象：

console.log(globalThis === window); // true

在 Node.js 中，我们可以使用以下代码来访问全局对象：

console.log(globalThis === global); // true

示例代码

下面是一个简单的示例，它演示了如何使用 globalThis 来编写跨平台的 JavaScript 代码：

// 定义一个全局变量
globalThis.myGlobalVar = 'Hello, world!';

// 在浏览器中输出全局变量
if (typeof window !== 'undefined') {
  console.log(globalThis.myGlobalVar); // Hello, world!
}

// 在 Node.js 中输出全局变量
if (typeof global !== 'undefined') {
  console.log(globalThis.myGlobalVar); // Hello, world!
}

// 在 Web Worker 中输出全局变量
if (typeof self !== 'undefined') {
  console.log(globalThis.myGlobalVar); // Hello, world!
}

// 在 Service Worker 中输出全局变量
if (typeof clients !== 'undefined') {
  console.log(globalThis.myGlobalVar); // Hello, world!
}

在这个示例中，我们首先定义了一个全局变量 myGlobalVar，然后分别在浏览器、Node.js、Web Worker 和 Service Worker 中输出了这个全局变量。无论在哪个平台上运行这个代码，输出结果都应该是 Hello, world!。这就说明了 globalThis 的作用，它可以让我们编写跨平台的 JavaScript 代码，而不用担心不同平台的全局对象名称不同的问题。

总结

在本文中，我们介绍了 ES2020 中的全局对象 globalThis，它提供了一种标准的方式访问全局对象，无论是在浏览器中还是在 Node.js 中，都可以使用 globalThis 来访问全局对象。使用 globalThis 可以让我们编写跨平台的 JavaScript 代码，而不用担心不同平台的全局对象名称不同的问题。

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