js 获取当前环境全局对象

CSDN 中文章不一定能及时更新，欢迎点击前往我的博客查看最新版本：许盛的博客

今天读 qiankun 的源码，看到了一段看不懂的代码 Function('return this')()，研究了一下原来是用来获取当前环境的全局对象的。

正好整理一下相关的知识，免得忘记。

在日常的开发中，前端接触的比较多的就是浏览器环境和 Node 环境，这两个环境中的全局对象是不一样的，业务代码中一般不怎么关心这个，但是如果是写通用的库，如何正确的获取全局对象就很重要了。

一般来说，有如下几种方式获取不同环境下的全局对象：

• 浏览器：通过 window、 self、 frames 访问。
• Node.js：通过 global 访问。
• Web Worker：通过 self 访问。

在 ES2020 标准中引入了 globalThis 对象，可以直接获取当前环境的全局对象，忽略不同环境的差异，但是老版本的浏览器或 node 可能会不支持，这时候就需要引入 pollyfill 了。

那么如何实现 pollyfill 呢？

function getGlobalObject() {
	return new Function("return this")();
}

通过 new Function 这种方法生成的函数，函数体内部没有单独的函数作用域，只能访问顶层对象，也就是说 this 就是指向的全局对象，就可以解决了。

但是在使用 内容安全策略（CSP） 的网站中不能使用 Function 构造函数以及 eval ，那么可以采用另一种方式，其实就是不停的 if 就行了：

function getGlobalObject() {
	if (typeof globalThis !== "undefined") {
		return globalThis;
	}

	if (typeof self !== "undefined") {
		return self;
	}

	if (typeof window !== "undefined") {
		return window;
	}

	if (typeof global !== "undefined") {
		return global;
	}

}