如何使用 ES10 中的 globalThis，实现在全局中访问 this

在 JavaScript 中，this 关键字通常指向当前函数的执行环境。但在某些情况下，我们可能需要在全局范围内访问 this。ES10 引入了 globalThis 对象，使得在任何情况下都可以访问全局对象。

globalThis 对象简介

globalThis 对象是一个全局对象，在浏览器中它指向 window 对象，在 Node.js 中它指向 global 对象。它的目的是为了在不同的环境中提供一个统一的方式来访问全局对象。

在 ES10 之前，我们可能需要使用一些 hack 的方式来访问全局对象，比如在浏览器中可以使用 window、self、frames 等对象来访问全局对象，而在 Node.js 中可以使用 global、process 等对象来访问全局对象。但是这些方式在不同的环境中都有一些限制和问题，而 globalThis 对象则提供了一种更加简单和统一的访问方式。

使用 globalThis 对象

使用 globalThis 对象非常简单，只需要在代码中直接使用 globalThis 即可访问全局对象。下面是一个示例代码：

function foo() {
  console.log(globalThis === this); // true
}

foo(); // true

在上面的代码中，我们定义了一个函数 foo()，在函数中使用 globalThis 和 this 关键字进行比较，可以发现它们是相等的。这说明我们可以使用 globalThis 对象来访问全局对象。

深入理解 globalThis 对象

globalThis 对象的实现方式并不是很复杂，它的定义如下：

// 定义 globalThis 对象
(function () {
  if (typeof globalThis !== "undefined") return;
  if (typeof self !== "undefined") { globalThis = self; return; }
  if (typeof window !== "undefined") { globalThis = window; return; }
  if (typeof global !== "undefined") { globalThis = global; return; }
  throw new Error("Cannot find global object");
})();

在上面的代码中，我们定义了一个立即执行函数，它首先判断 globalThis 是否已经存在，如果存在则直接返回。否则，它会按照一定的优先级判断 self、window、global 等对象是否存在，如果存在则将 globalThis 对象设置为这些对象之一。如果这些对象都不存在，则抛出一个错误。

这个实现方式非常简单和直观，它充分考虑了不同环境中的特点和限制，使得我们可以在任何环境中使用 globalThis 对象来访问全局对象。

总结

globalThis 对象是 ES10 中新增的一个全局对象，它提供了一种简单和统一的方式来访问全局对象。使用 globalThis 对象非常简单，只需要在代码中直接使用 globalThis 即可访问全局对象。在深入理解 globalThis 对象的实现方式之后，我们可以更好地理解它的作用和意义，从而更加灵活和高效地使用它。

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