JavaScript对象内箭头函数.call()调用返回undefined原因

这个现象的核心原因是箭头函数和普通函数的this绑定规则完全不同：

1. 箭头函数的this规则 #

箭头函数本身没有独立的this上下文，它的this是在函数定义时就通过词法作用域固定的，永远继承自它定义位置外层的第一个非箭头函数的this值，后续任何调用方式、包括call/apply/bind都无法修改箭头函数的this指向。
你写的箭头函数版本中，user对象定义在全局作用域，对象字面量本身不会创建新的作用域，因此about箭头函数定义时的外层就是全局作用域：

• 如果运行在严格模式下，全局作用域的this是undefined，访问this.fName自然返回undefined
• 如果运行在非严格模式下，全局作用域的this指向全局对象（浏览器环境是window，Node环境是globalThis），全局对象上不存在fName属性，同样返回undefined
  你调用user.about.call(user)时传入的user作为this上下文会被箭头函数直接忽略，完全不生效。

2. 普通函数的this规则 #

普通函数的this是调用时动态绑定的，不取决于函数定义位置，只取决于函数的调用方式：

• 直接作为对象方法调用时，this指向调用它的对象
• 用call/apply/bind调用时，this指向第一个参数传入的对象
• 直接独立调用时，严格模式下this为undefined，非严格模式指向全局对象
  你写的普通函数版本中，通过.call(user)显式把函数执行时的this绑定到user对象上，因此this.fName就能正确取到user对象上的fName属性值0xN1nja。

注：你贴的普通函数示例代码里写的是.call(user2)，属于笔误，实际传入的是user对象才会得到对应返回结果。

额外注意点 #

• 不要用箭头函数定义对象的方法，对象字面量不会产生独立作用域，箭头函数无法拿到对象本身作为this
• 箭头函数不能作为构造函数使用，用new调用会直接报错，本质原因也是它没有独立的this绑定
• 给箭头函数传call/apply/bind时，第一个参数会被直接忽略，只有后续的实参会正常传入函数

内容的提问来源于stack exchange，提问作者Abhimanyu Sharma