You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

这两个JavaScript函数定义语句是否完全等价?

JavaScript箭头函数赋值与普通函数声明的差异

二者并不完全等同,除了语法写法区别外,在运行时的行为存在多个核心差异,具体如下:

你提到的两段代码分别是:
第一种(箭头函数赋值给const变量):

const handleClick = () => alert('foo');

第二种(普通函数声明):

function handleClick() {
    alert('foo');
}

二者的核心差异有以下几点:

  • this绑定规则不同
    箭头函数没有独立的this上下文,它的this继承自定义时所在的外层作用域的this,且绑定后不会被call、apply、bind等方法修改。普通函数的this由调用时的场景决定:作为对象方法调用时this指向对象,作为DOM事件回调时this指向触发事件的元素,直接调用时非严格模式指向window、严格模式指向undefined,还可以通过call等方法手动修改this指向。
  • 构造函数能力不同
    普通函数声明可以通过new关键字作为构造函数创建实例对象,本身也持有prototype原型属性。箭头函数无法被new调用,执行new handleClick()会直接抛出错误,也不存在prototype属性。
  • arguments对象差异
    普通函数内部可以直接访问arguments类数组对象,获取所有传入的实参。箭头函数没有自身的arguments对象,如果在箭头函数内访问arguments,实际获取的是外层作用域的arguments,如果要获取自身的入参需要使用剩余参数语法(...args) => { /* 操作args */ }。
  • 提升规则不同
    普通函数声明存在函数提升特性,在同作用域下,即使调用语句写在函数声明语句之前,也可以正常执行。而第一种写法是将箭头函数赋值给const变量,仅存在变量提升但会进入暂时性死区,在变量赋值语句之前调用handleClick会抛出ReferenceError错误。
  • 生成器语法支持不同
    普通函数可以添加*标记为生成器函数,内部使用yield关键字暂停执行。箭头函数无法作为生成器函数使用,内部不允许使用yield关键字。

如果仅在全局作用域定义、不涉及上述特性相关的使用场景,二者直接调用的执行结果是一致的,但本质上并非只有语法层面的差异。


内容的提问来源于stack exchange,提问作者JSNinja

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.29 15:48:02