箭头函数是ES6引入的简洁函数写法,无this绑定、无arguments对象、不可用new调用、不支持new.target和super,适用于需词法this的场景。

箭头函数是 ES6 引入的一种简洁的函数写法,用 => 定义,本质是函数表达式的简写形式。它和普通函数(function 关键字声明或函数表达式)在语法、this 绑定、arguments、构造调用等方面有实质性差异。
箭头函数没有自己的 this
箭头函数不绑定自己的 this,而是继承外层作用域(词法作用域)的 this 值。普通函数的 this 在调用时才确定,取决于调用方式(如对象方法、独立调用、call/apply 等)。
例如:
普通函数中 this 会变:
立即学习“Java免费学习笔记(深入)”;
const obj = {
name: 'Alice',
regular() {
console.log(this.name); // 'Alice'
setTimeout(function() {
console.log(this.name); // undefined(this 指向全局或 undefined)
}, 100);
}
};
箭头函数自动捕获外层 this:
const obj = {
name: 'Alice',
arrow() {
console.log(this.name); // 'Alice'
setTimeout(() => {
console.log(this.name); // 'Alice'(继承 arrow 方法的 this)
}, 100);
}
};
箭头函数没有 arguments 对象
箭头函数内部访问不到 arguments,但可以使用剩余参数(...args)替代。
- 普通函数:可直接用
arguments获取所有实参 - 箭头函数:
arguments是引用外层函数的,若外层也没有,则报错;推荐统一用...args
示例:
function regular() {
console.log(arguments[0]); // 正常输出
}
const arrow = () => {
console.log(arguments[0]); // ReferenceError: arguments is not defined
};
const arrowFixed = (...args) => {
console.log(args[0]); // ✅ 推荐写法
};
箭头函数不能作为构造函数
箭头函数没有 prototype,也不能用 new 调用,否则会抛出错误。
- 普通函数:有
prototype,可用new创建实例 - 箭头函数:无
prototype属性,typeof仍是"function",但不可构造
例如:
const Regular = function(name) { this.name = name; };
const Arrow = (name) => { this.name = name; };
new Regular('Bob'); // ✅ 正常
new Arrow('Bob'); // ❌ TypeError: Arrow is not a constructor
箭头函数没有 new.target 和 super
箭头函数不支持 new.target(检测是否被 new 调用),也不支持 super(无法在类方法中用箭头函数访问父类方法)。因此,在 class 中定义生命周期方法或需要 super 的场景,必须用普通函数。
例如:
class Parent {
method() { console.log('parent'); }
}
class Child extends Parent {
arrowMethod = () => {
super.method(); // ❌ SyntaxError: 'super' keyword unexpected here
};
regularMethod() {
super.method(); // ✅ 正确
}
}
不复杂但容易忽略。用箭头函数时,重点想清楚:需不需要动态 this?要不要 new?有没有 arguments 需求?满足不了就换普通函数。










