ES12 之后，你需要知道的 globalThis 对象

在过去，开发者需要考虑在浏览器和 Node.js 上使用不同的代码来访问全局对象。然而，从 ES12（ES2021）开始，我们可以使用 globalThis 对象来访问全局变量，这个对象在浏览器、Node.js 和 Web Worker 中都能使用，包括严格模式和非严格模式。

globalThis 简介

globalThis 是一个全局对象，可用于获取全局变量和全局函数。在浏览器中，它相当于 window 对象；在 Node.js 中，它相当于 global 对象。

在过去，由于 JavaScript 运行在不同的环境中，访问全局对象需要根据当前环境的类型进行选择。但是现在，globalThis 已经成为了访问全局对象的标准方式。

globalThis 的优势

使用 globalThis 有以下优势：

• 接口一致：使用 globalThis 可以在所有环境下访问全局对象，它提供了一个统一的接口。
• 可读性更好：使用 globalThis 代替 window 和 global，代码的可读性更强。
• 未来更方便：随着新的环境出现，如 Web Assembly 或 Deno，使用 globalThis 可以访问全局对象而不需要修改代码。
• 环境不变：在浏览器和 Node.js 环境中，globalThis 对象可以在严格模式（strict mode）和非严格模式（non-strict mode）下正常工作。

globalThis 示例

以下示例演示了如何在浏览器和 Node.js 中使用 globalThis 对象访问全局变量。

// 访问 window 和 global 对象
console.log(window.innerWidth);
console.log(global.process.pid);

// 使用 globalThis 对象来访问全局变量
console.log(globalThis.innerWidth);
console.log(globalThis.process.pid);

上述代码中，我们输出了 window 对象的 innerWidth 属性和 global 对象的 process.pid 属性，然后使用 globalThis 对象的相应属性输出相同的结果。

总结

globalThis 对象是 JavaScript 中访问全局变量和函数的最佳方式。使用它可以增强代码的可读性和移植性，使代码更加未来化。值得注意的是，在使用 globalThis 时需要注意保留环境的兼容性。

希望这篇文章对你有所帮助，让你了解到 globalThis 的优点和如何使用它。

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