JS原型继承中方法内属性返回undefined但外部可读取如何修复？

你在重写的getDetails方法中直接通过this.__proto__.getDetails()调用父类方法，此时父类方法执行时的this指向的是Teacher.prototype对象，而非teacher1实例。personName、age这些属性都是挂载在实例自身上的，原型对象上并没有对应的属性，因此父类方法返回的内容里这两个字段都是undefined。而直接访问实例属性时读取的是实例自身挂载的值，所以可以正常获取。

• 普通函数的this指向由调用时的上下文决定：如果通过对象.方法()的形式调用，this会绑定到前面的对象上，你调用this.__proto__.getDetails()时，方法前面的对象是this.__proto__也就是Teacher.prototype，因此父类方法里的this指向这个原型对象，不是实例。
• __proto__是浏览器实现的非标准属性，ECMAScript标准中推荐使用Object.getPrototypeOf()来获取对象的原型，生产环境不建议直接使用__proto__。
• 原型继承场景下调用父类同名方法时，需要手动修改父类方法的this指向到当前实例，才能正确读取实例上的属性。

只需要修改Teacher.prototype.getDetails的实现，调用父类方法时通过call将this绑定到当前实例即可：

Teacher.prototype.getDetails = function() {
  // 调用父类原型方法，手动绑定this为当前实例
  return `${Person.prototype.getDetails.call(this)} Main subject is ${this.mainSubject}.`;
};

修改后执行console.log(teacher1.getDetails())就会输出正确结果：Person Name:Sakib. Age is 35. Main subject is Physics.

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