一个名为 globalThis的新属性为您提供了跨平台访问JavaScript中的全球对象。
在JavaScript中访问全球属性一直存在一些困难,这是因为不同的平台有不同的方式访问它。
- 客户端 JavaScript 使用
窗口或自我 - Node.js 使用
全球 - Web 工作者使用
自我
如果你只写客户端JavaScript,这不是一个巨大的问题,你可以简单地写窗口,以与全球对象进行交互。
但是,当您需要编写在多个平台上运行的便携式 JavaScript 时,会出现问题(例如:像 lodash这样的库,它在 Node.js 和客户端上都运作)。
最常见的解决方案是使用一个 shim 使用这样的代码来确定可用的全球对象:
1var getGlobal = function () {
2 if (typeof window !== 'undefined') {
3 return window; // Client-side JavaScript
4 }
5 if (typeof self !== 'undefined') {
6 return self; // Client-side JavaScript / Web workers
7 }
8 if (typeof global !== 'undefined') {
9 return global; // Node.js
10 }
11};
12
13var __global__ = getGlobal();
14
15if (typeof __global__.alert === 'function') {
16 console.log('Client-side land!');
17} else {
18 console.log('Node.js land!');
19};
使用全球化
由于globalThis在 Node.js/客户端/Web 工作者中可用,因此与全球对象的交互变得更加简单!
1if (typeof globalThis.alert === 'function') {
2 console.log('Client-side land!');
3} else {
4 console.log('Node.js land!');
5}
告别检查你在哪个平台! ✌️
结论
目前,‘globalThis’ 是第三阶段的 ECMAScript 建议,但是,包括 Chrome、Firefox 和 Safari(桌面/移动)在内的许多浏览器已经使这个新的 API 可用!
<$>[注] 有关‘globalThis’支票的详细信息 Axel Rauschmayer的 博客帖子 <$>