ES10 新特性之 globalThis 全局对象的详解

在 ES10 中推出了 globalThis 全局对象,该对象提供了一种标准的访问全局环境的方式。在不同的环境下,全局对象的名称不同,例如在浏览器环境中,全局对象是 window,而在 Node.js 环境中全局对象是 global。使用 globalThis,开发者可以统一获取全局对象,从而更加方便地编写跨平台的 JavaScript 代码。

globalThis 对象的含义和用法

globalThis 对象指代的是全局作用域下的 this 值,它指向全局对象。通过 globalThis,我们可以在任意上下文中访问到全局对象。

在 Node.js 环境中,globalThis 等价于 global 对象。在浏览器环境中,globalThis 等价于 window 对象。如果在另一个上下文中使用 globalThis,则可以根据具体环境的需求返回正确的全局对象。

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

通过 globalThis,我们可以更加方便地编写跨平台的 JavaScript 应用。让我们看看一个根据环境不同使用不同全局变量的例子:

const getGlobal = () => {
  if (typeof self !== 'undefined') {
    return self;
  }
  if (typeof window !== 'undefined') {
    return window;
  }
  if (typeof global !== 'undefined') {
    return global;
  }
  throw new Error('unable to locate global object');
};

上面代码中,getGlobal 函数会根据当前运行的环境返回正确的全局对象。使用 globalThis 可以使代码更简洁:

const getGlobal = () => {
  return globalThis;
};

globalThis 的应用场景

1. 跨平台的 JavaScript

globalThis 可以让开发者更加方便地编写跨平台支持的 JavaScript 应用。不同平台的代码可以通过 globalThis 访问到正确的全局变量。

2. 全局作用域下的变量声明

全局作用域下的变量声明在不同的平台上有着不同的方式。使用 globalThis,我们可以将变量声明在正确的全局对象上。

globalThis.myVar = 'Hello, world!';

// In a web browser
console.log(window.myVar); // 'Hello, world!'

// In Node.js
console.log(global.myVar); // 'Hello, world!'

3. 测试

在某些测试场景下,我们需要访问全局对象,以便在应用程序的不同部分中共享状态。使用 globalThis,我们可以跨平台地访问全局对象并实现这种共享。

总结

globalThis 是 ES10 中的一个新功能,它提供了一种标准的方式来访问全局环境。使用 globalThis 可以更加方便地编写跨平台的 JavaScript 应用,并且可以访问全局环境中声明的变量。此外,使用 globalThis 还可以在测试场景下方便地访问全局对象。

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


纠错反馈