ECMAScript 2020中的全局this更新

阅读时长 4 分钟读完

ECMAScript 2020 已经发布,这是 JavaScript 语言的最新版本。本篇文章将重点介绍其中的一个重要更新,即全局 this 值的变化。

全局 this 的问题

在 JavaScript 中,全局对象是 window(在浏览器环境中)或 global(在 Node.js 环境中)。当使用 var 或 function 关键字进行声明时,变量会成为全局变量。然而,如果在函数中使用 this,它是应用于调用该函数的对象而不是全局对象。因此,在全局上下文中使用 this 可能会产生混淆。下面是一个例子:

这里 this 指向全局对象,而全局对象并没有 myVar 属性。如此使用 this 不仅会使代码难以理解,还会产生意想不到的结果。

update

因此,ECMAScript 2020 引入了一个新的方式来获取全局 this,即 globalThis。它提供了跨平台、跨环境的全局 this 值。无论代码是在浏览器、Node.js 还是其他环境中运行,globalThis 始终代表全局对象。前面的例子中,可以使用以下代码解决问题:

在模块中增加globalThis

在 ES2020 中,globalThis 自动存在在任何 JavaScript 环境中。然而,这并不意味着它在所有环境下都可靠。在一些旧版本的浏览器或 Node.js 中,可能没有 globalThis 属性。在这种情况下,可以通过将以下代码添加到浏览器或 Node.js 中的模块的顶部,将 globalThis 显式地添加到环境中:

-- -------------------- ---- -------
----------------- -
  -- ------- ----------------- --- ------------ -
    ----------------------------- ------------- -
      ------ -------
      --------- ------
      ----------- ------
      ------------- ----
    ---
  -
--------- ------ --- ----------- - ------ -
   ------ ------ --- ----------- - ------ -
   ------ ---- --- ----------- - ---- - ------

这样,即使在旧版环境中,也可以使用 globalThis 获得正确的全局 this 值。

总结

ECMAScript 2020 中全局 this 的变化使开发者不再需要使用复杂的方法和技巧来获取全局 this 值,并且可以提高代码的可读性和可维护性。不过,在一些旧版本环境中,需要手动将 globalThis 添加到环境中。这是一项重大的改进,在开发者的日常工作中具有实际意义,普及推广使用将会提高开发效率和代码质量。

示例代码

-- -------------------- ---- -------
-- ---- -

--------------- - --------
-------- --------- -
  -----------------------
-
---------- -- -- -------

-- ---- -------- ----------

--------- -------- -
  -- ------- ----------------- --- ------------ -
    ----------------------------- ------------- -
      ------ -------
      --------- ------
      ----------- ------
      ------------- ----
    ---
  -
--------- ------ --- ----------- - ------ -
    ------ ------ --- ----------- - ------ -
    ------ ---- --- ----------- - ---- - ------

---------------------- --- -------- -- -- -------------
---------------------- --- -------- -- -- ------ ------- ----

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/645f4ad5968c7c53b01580ab

纠错
反馈