globalThis

全局属性 globalThis 包含全局的 this 值，类似于全局对象（global object）

描述

在以前，从不同的 JavaScript 环境中获取全局对象需要不同的语句

• 在 Web 中，可以通过 window、self 或者 frames 取到全局对象
• 在 Web Workers 中，只有 self
• 在 Node.js 中，它们都无法获取，必须使用 global

在松散模式下，可以在函数中返回 this 来获取全局对象，但是在严格模式和模块环境下，this 会返回 undefined。你也可以使用 Function('return this')()，但那些禁用eval()的环境，如在浏览器中的CSP^[1]，不允许这样使用Function

globalThis 提供了一个标准的方式来获取不同环境下的全局 this 对象（也就是全局对象自身）。不像 window 或者 self 这些属性，它确保可以在有无窗口的各种环境下正常工作。所以，你可以安心的使用 globalThis，不必担心它的运行环境。为便于记忆，你只需要记住，全局作用域中的 this 就是 globalThis。

HTML 与 WindowProxy

在很多引擎中， globalThis 被认为是真实的全局对象的引用，但是在浏览器中，由于 iframe 以及跨窗口安全性的考虑，它实际引用的是真实全局对象（不可以被直接访问）的 Proxy 代理。在通常的应用中，很少会涉及到代理与对象本身的区别，但是也需要加以注意。

命名

并没有采用一些更常见的命名方式，如 self 和 global，这是为了避免影响现存代码的兼容性

语法

                            

                            

                            
globalThis
                        

示例

在 globalThis 之前，获取某个全局对象的唯一方式就是 Function('return this')()

在Vue3源码中使用了如下的方式:

                    
let _globalThis

const getGlobalThis= function(){
  return (
    _globalThis ||
    (_globalThis =
      typeof globalThis !== 'undefined'
        ? globalThis
        : typeof self !== 'undefined'
          ? self
          : typeof window !== 'undefined'
            ? window
            : typeof global !== 'undefined'
              ? global
              : {})
  )
}

const target = getGlobalThis()
console.log(target)
// [object Window]

                    

                    

                      

                        执行 ›
                      
                      

                    

注意

在 Node.js 中，typeof global 可能会报错。
解决方法：

                            

                            

                            
yarn add -D @types/node