为何给子对象的__proto__属性赋值后，部分属性看似消失？

相关代码 #

// Same code on Code Snippet By StackOverflow
let Teacher = function (tn) {
    this.tN = tn;
};
let PhTeacher = function (msub) {
    this.mSub = msub;
}

let objectOfPhT = new PhTeacher("Phsyics");
objectOfPhT.__proto__ = new Teacher("Aslam");
console.log(objectOfPhT)

不同环境的输出 #

• Stack Overflow代码片段输出：

{
  "mSub": "Phsyics",
  "tN": "Aslam"
}

• VS Code（Node.js环境）输出：

Teacher { mSub: 'Phsyics' }

原因解析 #

1. 属性存储位置差异：mSub是objectOfPhT自身的属性，而tN存储在它的原型对象（即new Teacher("Aslam")实例）上，属于原型链层级的属性，并非对象自身拥有。

2. 不同环境的console.log行为不同：

   • Stack Overflow的代码片段工具打印对象时，会遍历整个原型链，展示所有可枚举属性，因此能看到tN；
   • VS Code使用的Node.js环境，console.log默认只显示对象自身的可枚举属性，同时标注对象的构造函数类型（因为objectOfPhT的原型指向Teacher实例，所以类型显示为Teacher）。但tN并没有消失，你可以直接通过objectOfPhT.tN访问到这个值。

补充：推荐的原型继承写法 #

直接给__proto__赋值不是标准继承方式，更规范的写法是修改构造函数的prototype：

let Teacher = function (tn) {
    this.tN = tn;
};
let PhTeacher = function (msub) {
    // 调用父构造函数，继承实例属性
    Teacher.call(this, "Aslam");
    this.mSub = msub;
}

// 建立原型链继承
PhTeacher.prototype = Object.create(Teacher.prototype);
// 修正constructor指向，避免继承自Teacher
PhTeacher.prototype.constructor = PhTeacher;

let objectOfPhT = new PhTeacher("Phsyics");
console.log(objectOfPhT);
// 此时objectOfPhT自身拥有tN和mSub，原型链指向Teacher.prototype

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