如何掌握JavaScript中的原型链_它与继承有什么关系

javaScript原型链是对象继承与属性查找的核心机制，每个对象通过[[prototype]]内部属性链接到原型，形成从实例到Object.prototype再到NULL的委托链。

javascript中的原型链是理解对象行为和继承机制的核心。它不是语法糖，而是语言底层运作方式——每个对象都有一个内部属性 [[Prototype]]，指向它的原型对象；当访问一个属性或方法时，若当前对象没有，引擎会沿着这条链向上查找，直到找到或到达终点（null）。

原型链是怎么形成的

当你用构造函数或类创建对象时，JavaScript自动建立原型链接：

• 函数的 prototype 属性是一个对象，它将成为用 new 创建的实例的原型（即实例的 [[Prototype]] 指向它）
• 这个 prototype 对象自身也有 [[Prototype]]，通常指向 Object.prototype
• Object.prototype 的 [[Prototype]] 是 null，链在此终止

例如：const arr = [1, 2]; 中，arr.__proto__ === Array.prototype，Array.prototype.__proto__ === Object.prototype，Object.prototype.__proto__ === null。

原型链就是JavaScript的继承机制

js没有类继承的“拷贝”概念，只有基于原型的委托（delegation）。所谓“继承”，本质是子对象通过原型链访问父级对象的属性和方法：

立即学习“Java免费学习笔记（深入）”；

• 子类构造函数的 prototype 显式设置为父类实例（如 Child.prototype = Object.create(Parent.prototype)），就建立了继承关系
• es6 class 和 extends 只是语法糖，底层仍靠修改原型链实现
• 所有方法都存放在原型上，而非每个实例中，节省内存且支持动态修改

关键操作与常见误区

掌握原型链离不开几个核心操作和易错点：

• 用 Object.getPrototypeOf(obj) 获取对象的原型，比非标准的 __proto__ 更可靠
• 用 obj.hasOwnProperty(prop) 判断属性是否在对象自身（而非原型链上）
• 避免直接重写整个 prototype（如 Foo.prototype = {...}）后忘记恢复 constructor 指针
• 箭头函数没有自己的 this，也没有 prototype，不能用作构造函数

如何验证和调试原型链

浏览器控制台里可以直观观察原型结构：

• 输入 obj.__proto__ 查看直接原型
• 用 console.dir(obj) 展开对象，能看到 [[Prototype]] 链路
• 调用 obj.toString() 时，即使 obj 自身没定义，也能执行，说明它从 Object.prototype 委托获得

不复杂但容易忽略：原型链只影响读取（get），赋值（set）默认总是在对象自身上新建属性，除非显式操作原型。