在前端开发中，我们经常需要使用 JavaScript 进行编程。JavaScript 的版本很多，其中最新的是 ECMAScript 2021（也称为 ES12）。ES12 中有三个非常重要的全局对象，它们是 globalThis、this 和 window。虽然它们很相似，但它们之间存在很大的区别。本文将详细介绍它们之间的区别，并给出一些示例代码。
globalThis
globalThis 是在 ES11 中引入的全局对象，它提供了一种可以在任意执行上下文中访问全局对象的标准化方式。它可以用来代替之前的全局对象（如 window、self、global 等），以解决多种执行上下文中的全局对象不同的问题。
我们可以使用以下代码访问 globalThis：
console.log(globalThis);
使用 globalThis 的好处在于我们可以在任何执行上下文中使用它，而不需要关心当前执行上下文是什么。例如，在浏览器中，它将返回 window 对象，在 Node.js 环境中，它将返回 global 对象。
this
this 是 JavaScript 中的一个关键字，用于表示当前执行上下文的对象。在全局作用域中，this 代表 window 对象。在函数中，this 代表函数调用的对象。在对象方法中，this 代表调用该方法的对象。
下面是一个示例代码：
-- -------------------- ---- ------- -- ----- ---------------- --- -------- -- ---- -------- ----- - ------------------ - ------ -- ------ ----- --- - - ----- - ------------------ - -- ---------- -- ---展开代码
window
window 是浏览器中的一个全局对象，它代表当前打开的浏览器窗口。window 对象包含了浏览器窗口的各种属性和方法，如浏览器窗口的大小、网页的地址，以及浏览器窗口的打开和关闭等。如果我们在非浏览器环境下使用 window，它将会是 undefined。
下面是一个示例代码：
console.log(window); // GlobalWindow console.log(window.innerWidth); // 浏览器窗口的内部宽度 window.open('http://www.example.com'); // 打开新窗口
globalThis vs. this vs. window
globalThis、this 和 window 之间的最大区别在于它们所代表的对象不同。globalThis 代表当前的全局作用域，可以在任何执行上下文中使用；this 代表当前执行上下文的对象，可以用来访问该对象的属性和方法；而 window 仅仅是浏览器中的一个全局对象，只能在浏览器中使用。
我们可以通过将 this 或者 window 赋值给一个变量，来将它们赋值给全局对象。但这样做是不可取的，因为它们只是在当前执行上下文中是全局对象，而在其他执行上下文中不一定是全局对象。
总结
在本文中，我们详细介绍了 ES12 中的 globalThis、this 和 window，包括这三者之间的区别以及使用它们的方法。了解它们之间的差异可以帮助我们更好地理解 JavaScript 中的对象和作用域，并且在编写 JavaScript 代码的时候更加得心应手。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64fd431a95b1f8cacdccc05e
