JavaScript,箭头函数能否访问this和arguments?
发布于 作者:苏南大叔 来源:程序如此灵动~

本文聚焦于箭头函数里面的this
和arguments
,箭头函数是一种特殊的函数。它的代码内部的this
以及arguments
表现,和普通函数代码差别较大。

苏南大叔的“程序如此灵动”博客,记录苏南大叔的代码编程经验总结。本文测试环境:nodejs@20.18.0
,chrome@132.0.6834.84
。箭头函数不是不支持this
,只是this
的设置方式不同。arguments
对象虽然不支持,但是有替换方案。
箭头函数
箭头函数是一种更简洁的函数写法,通常用于简单的、无复杂逻辑的函数。
this访问
试图访问this
:
纯node
环境下,输出:
页面环境下,输出:

运行时绑定this失败
对于箭头函数来说,使用bind()
/apply()
/call()
绑定this
,是不生效的。
输出:
参考文章:
命名时绑定
箭头函数的this
,并不支持后续的动态绑定。而是在定义的时候,就进行了绑定。而且this
取自上下文,准备的来说,是取自上一层作用域。
输出:

所以,尽量少用箭头函数和this.
的搭配组合,可能会产生歧义。
访问 arguments
试图访问arguments
:
纯node
环境下,输出:
页面环境下,直接报错:
解决方案
使用...reset
剩余参数,代替arguments
。
参考文章:

继承外部arguments
如果箭头函数的外部,存在合法的arguments
参数,这个在作用域里面属于全局变量。会直接导致箭头函数里面的arguments
非法变合法。例如:
输出是:

没有prototype
prototype
这个词,听起来是很遥远。但是,它却能区分箭头函数和普通函数。箭头函数没有.prototype
。
对比方案
本文的对比代码如下。重大区别就是,没有使用箭头函数,而是普通的命名函数。
输出:

结语
更多苏南大叔的JavaScript
经验文章,请点击:


