引言
在 Web 开发中，全局对象扮演着重要角色。在 JavaScript 中，全局对象是 window，但是在不同环境下，全局对象可能是不同的，比如在 Node.js 环境下，全局对象是 global。
此时，我们需要一种跨环境的方式访问全局对象，ES2020 标准提出了新的全局属性 globalThis，它可以在任意环境下都能够访问全局对象。
本文将详细讲解 globalThis 的使用方法和其在前端开发中的应用。
globalThis 的使用
globalThis 可以直接在任何地方使用，与 window 和 global 一样。
console.log(globalThis); // 打印出全局对象，如 window 或 global 等
这段代码可以在任何环境下运行，不需要考虑全局对象的差异。因此，我们可以使用这种方式来编写跨平台的代码。
同时，与全局对象不同，globalThis 是可以被修改的。
globalThis.myGlobalValue = 'Hello, world!'; console.log(window.myGlobalValue); // 'Hello, world!' console.log(global.myGlobalValue); // 'Hello, world!' console.log(myGlobalValue); // 'Hello, world!'
上述代码可以在浏览器和 Node.js 等环境下运行，并且可以使全局变量在不同环境下都得到修改。
globalThis 在前端开发中的应用
globalThis 在前端开发中的应用非常广泛，这里举几个例子说明其应用场景。
应用一：跨平台开发
在至今为止，开发跨平台应用的难度一直很大，因为不同平台的全局对象是不同的，而且语法也有所不同。
但是，有了 globalThis，我们可以直接访问全局对象，这样就可以避免这些问题。
// 跨平台开发代码示例
const global = typeof globalThis !== 'undefined' ? globalThis :
typeof window !== 'undefined' ? window :
typeof global !== 'undefined' ? global :
this;这段代码可以在任意环境下运行，并且可以经过一些兼容性处理来解决不同平台的问题。
应用二：小工具编写
在编写小工具时，我们常常需要访问全局对象来获取一些信息，比如当前时间、浏览器信息等。
通过 globalThis，我们可以方便地获取全局对象，这样就可以让小工具在跨平台的情况下得到正确的结果。
// 获取当前时间 const time = new Date(globalThis.Date.now()); // 获取浏览器信息 const browser = globalThis.navigator.userAgent;
这些代码运行在不同环境下，可以得到正确的结果。
总结
globalThis 是 ES2020 标准中的新特性，它可以让开发者在任意环境下都能够访问全局对象。
通过 globalThis，我们可以方便地编写跨平台的代码，同时还可以在小工具编写中充分发挥其作用。
因此，学习和掌握 globalThis 对于前端开发者来说具有重要意义，它可以让我们更加便捷地开发应用程序。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6533373e7d4982a6eb6b37e1