JavaScript箭头函数

特点

不绑定自己的this，而是继承外部作用域的this值

const obj = {
    data: 42,
    method1: function(){
        console.log(this.data); // 42
    },
    method2: function(){
        console.log(this.data); // undefined
    }    
    

原型方法的困境

在类或构造函数中使用箭头函数作为原型方法时，每个实例都会创建该函数的副本，而非共享同一函数引用，这会增加内存消耗。

无法被构造

箭头函数不能用作构造函数，尝试使用new操作符会抛出错误：

const Person = name => {
    this.name = name;
}
const jack = new Person('Jack'); // TypeError; Person is not a constructor

arguments对象的缺失

箭头函数不绑定arguments对象，这在需要处理不定数量参数时带来不便：

    function regular(){
        console.log(arguments)
    }
    const arrow = () =>{
        console.log(arguments) // 引用错误或指向外部作用域的arguments
    }

总结

面对这些陷阱，通常遵循以下原则：

• 在简单的函数表达式、回调和数组方法中使用箭头函数

• 在需要this绑定、arguments对象或可能作为构造函数的场景使用传统函数

• 在类方法和对象方法中避免使用箭头函数

• 根据团队习惯和项目上下文灵活选择