JavaScript原型链与继承详解

JavaScript的原型链是其面向对象机制的底层核心，通过对象内部的[[Prototype]]隐式引用构建起一条逐级向上查找属性和方法的链条，最终终止于null；它不仅解释了为何普通对象能调用toString等方法，更支撑着构造函数继承、ES6 class（本质是语法糖）以及各种继承模式的实现逻辑，同时伴随引用类型共享、instanceof判定依赖等关键细节——深入理解原型链，才能穿透语法表象，真正掌握JavaScript动态、灵活且独特的对象行为本质。

JavaScript 中的原型链是对象继承的核心机制，它决定了一个对象如何查找属性和方法。每个对象内部都有一个隐式引用（[[Prototype]]），指向它的原型对象；而这个原型对象本身也可能有原型，层层向上，直到最终指向 null——这条链接起来的链条就是原型链。

原型链的本质：属性查找路径

当访问一个对象的属性时，JavaScript 引擎会按以下顺序查找：

• 先在对象自身上查找该属性；
• 如果没找到，就去它的 [[Prototype]]（即 __proto__ 或 Object.getPrototypeOf() 返回的对象）上找；
• 如果原型上也没有，就继续查原型的原型，一直向上；
• 直到找到该属性，或到达原型为 null 的顶层（通常是 Object.prototype）为止。

例如：{}.toString() 能调用成功，是因为普通对象自身没有 toString，但它的原型是 Object.prototype，而后者定义了这个方法。

构造函数与 prototype 属性的关系

函数对象有一个显式的 prototype 属性（仅对函数有效），它是一个对象，会被自动赋给用该函数创建的实例的 [[Prototype]]。

比如：

function Person(name) { this.name = name; }
Person.prototype.sayHello = function() { return 'Hi, I am ' + this.name; };

const p = new Person('Alice');
console.log(p.sayHello()); // 'Hi, I am Alice'

这里 p.__proto__ === Person.prototype，所以 p 可以通过原型链访问到 sayHello。

原型链如何实现继承

继承的本质，就是让子类型的实例能访问父类型的属性和方法，这通过控制原型链来实现：

• 将子构造函数的 prototype 指向父构造函数的一个实例（经典寄生组合式继承中常用 Object.create(Parent.prototype)）；
• 这样子类实例的 [[Prototype]] 链就会包含父类的 prototype，从而获得其方法；
• 同时保留自己的构造器信息（需手动修复 constructor）。

ES6 的 class 语法只是语法糖，底层仍是基于原型链的继承机制：extends 实际设置的就是子类 prototype 的原型为父类 prototype。

常见陷阱与注意事项

原型链虽简洁，但容易引发误解：

• 修改原型上的引用类型属性（如数组、对象），会影响所有共享该原型的实例；
• instanceof 和 isPrototypeOf() 判断依赖原型链，而非构造函数本身；
• 箭头函数没有 prototype，不能用作构造函数；
• Object.create(null) 创建的对象没有原型，因此不继承任何内置方法（如 toString）。

理解原型链，才能真正掌握 JavaScript 的面向对象行为，而不是只停留在 class 表面。

今天关于《JavaScript原型链与继承详解》的内容就介绍到这里了，是不是学起来一目了然！想要了解更多关于的内容请关注golang学习网公众号！