js取到顶层对象的几种方式

107 阅读1分钟

前言

众所周知,js是一门脚本语言,它依赖浏览器作为自己的执行环境.但是并不是只有浏览器可以作为js的执行环境,所以,浏览器提供的一些api,addr或者是顶层对象(window),在非浏览器的环境下,就无法使用了.那么这里我将记录几种在浏览器中可以获取到顶层对象的方式.因为作者的工作仅限于浏览器环境的开发,所以这里只做记录,并不会给出兼容方案.后续当作者了解了详细情况,再进行更新

1、window

适用范围:

1、浏览器单一的页面,区别于内嵌其他页面的情况.内嵌其他页面,取到的window不是同一个

不适用的范围:

1、Node 2、WebWorker

2、this

适用范围:

1、全局环境

不适用的范围:

1、Node.js模板返回当前模块; 2、

3、self

适用范围:

1、浏览器 2、WebWorker

不适用范围

1、Node

4、top

适用范围

1、不同框架下面,可以取到同一个顶层对象(iframe嵌入的页面中,可以通过top来进行postMessage的消息传递)

5、globalThis

适用范围: 1、ES2020 新提出的方案,任何环境都可以拿到globalThis

暂时作为记录,后面会了解各种方式的优缺点,以及使用场景.或者有了新的获取顶层对象的方式,再进行补充