如何通过JavaScript原型继承使方法绑定到调用它的对象？

问题出在你用了箭头函数作为log方法：箭头函数没有自己的this，它会沿用定义时的上下文，而且你直接硬引用了obj1.name，所以不管哪个对象调用这个方法，都会输出obj1的name值。

要解决这个问题，只需要把箭头函数改成普通函数，用this来指代调用该方法的对象：

const obj1 = {
    name: "Admin",
    // 替换箭头函数为普通函数
    log() {
        console.log(this.name);
    }
};

const obj2 = {
    name: "Moderator",
};

obj2.__proto__ = obj1;

obj1.log(); // 输出 "Admin"
obj2.log(); // 输出 "Moderator"

原理说明 #

普通函数作为对象方法被调用时，this会自动绑定到发起调用的对象：

• 当obj1.log()执行时，this指向obj1，所以this.name就是obj1.name；
• 当obj2.log()执行时，因为obj2的原型是obj1，引擎会先在obj2自身找log方法，找不到就去原型链的obj1上找，找到后调用时this依然指向obj2，所以this.name就是obj2.name。

更规范的原型设置方式 #

不推荐直接使用__proto__（它属于非标准属性，虽然主流浏览器支持），更规范的做法是用Object.create()创建带指定原型的对象：

const obj1 = {
    name: "Admin",
    log() {
        console.log(this.name);
    }
};

// 创建以obj1为原型的obj2，并添加name属性
const obj2 = Object.create(obj1);
obj2.name = "Moderator";

obj2.log(); // 输出 "Moderator"

内容的提问来源于stack exchange，提问作者Nikon George