JavaScript中如何获取箭头函数的函数名？

核心原因 #

• 箭头函数没有自身的arguments对象，你在箭头函数内访问的arguments实际继承自外层作用域，根本不是当前箭头函数的参数对象
• 箭头函数本身没有callee属性，就算拿到外层arguments，也找不到当前箭头函数的引用
• 哪怕是把箭头函数赋值给对象的abc属性，箭头函数的name属性默认也是空字符串，不会自动继承属性名作为自身函数名

可行替代方案 #

如果需要在函数内部获取自身名称，最稳妥的方案是放弃箭头函数，改用普通函数写法：

const obj = {
  abc: function() {
    let funcName = arguments.callee.name
    // 非严格模式下可以正常拿到 'abc'
  }
}

如果一定要使用箭头函数，可以用以下两种变通写法：

// 方案1：先把箭头函数赋值给独立变量，再挂载到对象上
const abc = () => {}
const obj = { abc }
console.log(obj.abc.name) // 输出 'abc'

// 方案2：手动给箭头函数定义name属性
const obj = {
  abc: () => {
    let funcName = obj.abc.name
  }
}
Object.defineProperty(obj.abc, 'name', {value: 'abc', configurable: true})

注意：arguments.callee在严格模式下是被禁用的，不管普通函数还是箭头函数，严格模式下访问都会直接抛出错误，生产环境不建议依赖这个属性。

内容的提问来源于stack exchange，提问作者Saiyavong MITTHASONE