es6如何获取顶层对象

本篇内容介绍了“es6如何获取顶层对象”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！

成都创新互联是一家企业级云计算解决方案提供商,超15年IDC数据中心运营经验。主营GPU显卡服务器，站群服务器，成都温江机房，海外高防服务器，大带宽服务器，动态拨号VPS，海外云手机，海外云服务器，海外服务器租用托管等。

es6获取顶层对象的方式：1、利用“typeof window !== 'undefined' ? window : (...) ? global : this”方法获取；2、利用“var getGlobal = function () {...throw new Error('unable to locate global object');};”方法获取。

本教程操作环境：windows10系统、ECMAScript 6.0版本、Dell G3电脑。

es6获取顶层对象的方式

ES6之前，顶层对象的属性和全局变量是等价的，但是在ES6，顶层对象和全局对象开始分离。

不分离的弊端

无法在编译阶段就报出变量未声明的错误，只有运行时才知道。
容易在不知不觉中创建全局变量
顶层对象可随意读写
window对象有窗口的意思，指的浏览器的窗口对象。而顶层对象有实体意义是一个不合适的设计

改变方式

var和function命令声明的全局变量，依旧是顶层对象的属性。
let、const、class声明的全局变量，不属于顶层对象的属性。

顶层对象

浏览器：window对象

Node：global对象

不统一的顶层对象

浏览器中顶层对象是window，但是Node和Web Worker没有window。

浏览器和Web Worker中，self也指向顶层对象，但是Node没有self。

Node中，顶层对象是global，但其他环境不支持。

获取顶层对象

局限性

全局环境中，this返回顶层对象；

Node模块和ES6模块中，this返回当前模块

函数中的this

(1) 单纯作为函数运行，this返回顶层

(2) 严格模式下，返回undefined

new Function(‘return this’)();总是返回全局对象。

但是如果浏览器用了CSP，那么eval，new Function这些方法都可能无法使用

CSP：Content Security Policy，内容安全政策。它以白名单的机制对网站加载或执行的资源起作用，在网页中通过HTTP头信息或者meta元素定义。但是也造成了以下问题
eval及相关函数被禁用。
内嵌的JavaScript代码将不会执行。
只能通过白名单来加载远程脚本。

获取顶层对象的方法

// 方法1
// 针对 浏览器中 顶层对象是window，但是Node和Web Worker没有window。
( 
	typeof window !== 'undefined' ? window : (
		typeof process === 'object' &&
		typeof require === 'function' &&
		typeof global === 'object'
	) ? global : this
);

//方法2
// 针对 浏览器和Web Worker中，self也指向顶层对象，但是Node没有self。
var getGlobal = function () {
	if (typeof self !== 'undefined') { 
		return self; 
	}
	if (typeof window !== 'undefined') {
		return window; 
	}
	if (typeof global !== 'undefined') {
		return global; 
	}
	throw new Error('unable to locate global object');
};

“es6如何获取顶层对象”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站，小编将为大家输出更多高质量的实用文章！

网页题目：es6如何获取顶层对象
URL地址：http://shouzuofang.com/article/pgespj.html

网站建设知识