JavaScript原型链与继承解析

JavaScript的继承本质是基于对象内部[[Prototype]]链的动态属性查找机制，class只是让原型链操作更简洁的语法糖；new操作符背后自动完成原型链接、this绑定与构造执行，而Object.create等方法则提供了手动构建原型链的灵活手段，但需警惕constructor修复、赋值遮蔽、__proto__滥用等常见陷阱——理解这些底层逻辑，才能真正掌握JS面向对象的精髓，写出健壮可维护的继承代码。

JavaScript 的继承不是靠 class 关键字“实现”的，而是靠对象内部的 [[Prototype]] 链天然运作的；class 只是语法糖，背后全是原型链在干活。

为什么 new 一个函数会得到有 __proto__ 的对象

每次调用 new Fn()，JS 引擎会自动做三件事：创建空对象、把该对象的 [[Prototype]] 指向 Fn.prototype、再把 this 绑给这个对象并执行构造函数。所以结果对象的 __proto__ 就等于 Fn.prototype。

• __proto__ 是每个对象都有的内部链接（非标准但广泛支持），指向它的原型对象
• Fn.prototype 是函数独有的属性，初始是一个普通对象，带一个 constructor 指回 Fn
• 修改 Fn.prototype 上的属性或方法，所有通过 new Fn() 创建的实例都能立即访问到

Object.create(null) 和 Object.create(Fn.prototype) 的区别

前者创建的是“无原型”的对象，__proto__ 为 null，不继承任何东西；后者创建的对象，其 __proto__ 直接指向 Fn.prototype，是手动模拟 new 的关键步骤。

• 用 Object.create(Fn.prototype) 构建子类原型时，必须显式设置 constructor，否则 child.prototype.constructor 会指向父类
• 不推荐直接改 __proto__，它性能差且不可靠；Object.setPrototypeOf() 是标准替代，但依然应避免频繁使用
• Object.create(null) 常用于造哈希表或配置对象，避免意外继承 toString 等方法引发冲突

class extends 底层还是走 prototype 链吗

是的。Babel 编译或 V8 执行 class A extends B 时，本质仍是设置 A.prototype.__proto__ === B.prototype，同时确保 A.__proto__ === B（静态方法可继承）。super() 调用的也是 B 构造函数。

• 子类 constructor 中必须调用 super()，否则无法初始化 this —— 这是因为子类的 this 依赖父类构造逻辑来绑定原型链
• extends null 是合法的，此时子类原型链终点是 null，不继承 Object.prototype 上的方法
• 箭头函数没有 prototype，不能被 new，也不能作为 extends 的右值

真正容易被忽略的，是原型链上属性查找只发生在读取时，而赋值永远写在当前对象自身；很多人以为 obj.x = 1 会修改原型上的 x，其实只是在 obj 上新增了一个自有属性。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《JavaScript原型链与继承解析》文章吧，也可关注golang学习网公众号了解相关技术文章。