javascript继承关系图的核心是准确呈现__proto__、prototype和构造函数三者的指向关系：实例.__proto__指向构造函数.prototype，函数.prototype指向其原型对象，子类原型.__proto__指向父类.prototype，最终链至object.prototype→null。
JavaScript 继承关系图的核心，是把抽象的原型链变成可看、可验、可推演的结构。它不是画个类图就完事，而是要准确反映 __proto__、prototype 和构造函数三者之间的指向关系。画得对，才能真正理解为什么子实例能调用父方法，为什么修改原型上的对象会影响所有实例。
先理清三根关键指针
一张靠谱的继承图必须标清以下三个方向：
-
实例 → 构造函数.prototype：每个 new 出来的对象，其
__proto__都严格等于它构造函数的prototype -
构造函数 → prototype 对象：每个函数都有
prototype属性，它是一个普通对象，默认带constructor指回自身 -
prototype 对象 → 上级 prototype：当子类原型被设为父类实例（如
Child.prototype = new Parent()），该 prototype 的__proto__就指向Parent.prototype
手绘继承图的四步法
以 function Animal() {} 和 function Dog() {} 为例：
- 第一步：画出
Animal.prototype和Dog.prototype两个独立对象框 - 第二步：从
Dog.prototype向上画箭头，标注“__proto__ → Animal.prototype” - 第三步：在
Animal.prototype框里写上constructor: Animal；在Dog.prototype框里补上constructor: Dog（否则它会沿链找到Animal） - 第四步：画一个
new Dog()实例，箭头连到Dog.prototype，再连到Animal.prototype，最后终点是Object.prototype→null
用浏览器 DevTools 快速验证图是否正确
不用画错重来，直接在控制台跑这几行就能校验：
const d = new Dog(); d.__proto__ === Dog.prototype // 应为 trueDog.prototype.__proto__ === Animal.prototype // 设了继承后应为 trueDog.prototype.constructor === Dog // 若没手动修复，这里常是 falsed instanceof Animal // 应为 true，说明原型链通达
避免常见图示陷阱
很多继承图误导初学者，问题集中在：
- 把
Child.prototype = Parent.prototype当作继承——这其实是共享，不是继承，会污染父类原型 - 漏画
Object.prototype → null这一终点，导致误以为链可以无限延伸 - 把构造函数本身画成原型链一环（比如画“
Dog → Animal”箭头），其实构造函数只是创建工具，真正参与链的是它的prototype - 用 UML 类图风格画 JavaScript 继承，强行套用“父类→子类”实线箭头，反而掩盖了原型链的动态查找本质
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
