什么是Javascript的箭头函数?

箭头函数是JavaScript中语法更简洁的函数定义方式,无自身this、arguments、super或new.target,不可用作构造函数,适合回调等需词法this绑定场景,复杂逻辑仍推荐传统函数。

箭头函数是 JavaScript 中定义函数的一种简洁写法,它没有自己的 thisargumentssupernew.target,且不能用作构造函数。

语法更简短

相比传统函数表达式,箭头函数省略了 function 关键字和花括号(单参数、单表达式时还可省略括号和 return):

  • 传统写法: const add = function(a, b) { return a + b; };
  • 箭头函数: const add = (a, b) => a + b;
  • 单个参数可省括号:const square = x => x * x;
  • 无参必须写空括号:const sayHi = () => console.log('Hi');

this 绑定是词法的

箭头函数不创建自己的 this,而是继承外层作用域的 this 值。这在回调、定时器或事件处理中特别有用,避免手动绑定或使用 bind

  • 普通函数中 this 可能丢失(如 setTimeout(obj.method, 100)
  • 用箭头函数可自然保留上下文:setTimeout(() => obj.method(), 100);
  • 类方法中常用:handleClick = () => { this.setState({ clicked: true }); };

不能作为构造函数

箭头函数没有 prototype 属性,也不支持 new 调用:

  • const Foo = () => {}; new Foo(); // TypeError: Foo is not a constructor
  • 需要实例化对象时,必须用传统函数或 class
  • 也没有 arguments 对象,可用剩余参数替代:(...args) => args[0]

基本上就这些。用对场景能提升可读性,但别为了简洁牺牲清晰度——比如多行逻辑、需要动态 this 或构造行为时,还是该用普通函数。