JavaScript原型链是什么以及如何理解它？-js教程-PHP中文网

JavaScript原型链是什么以及如何理解它？

紅蓮之龍

发布： 2025-12-21 20:09:09

原创

880人浏览过

JavaScript原型链是对象间实现继承的隐式路径，由__proto__（指向构造函数prototype）和prototype（函数特有，供实例继承）构成，终点为null；属性查找沿链向上直至Object.prototype或undefined。

javascript原型链是什么以及如何理解它？

JavaScript原型链是对象之间用来实现属性和方法继承的一条隐式连接路径。每个对象内部都有一个指向其原型对象的链接，而原型对象本身也可能有原型，这样层层向上，直到到达 null（即原型链终点），就构成了原型链。

原型链的核心：proto 与 prototype

理解原型链要分清两个关键属性：

__proto__ 是每个实例对象都有的内部属性，指向它的构造函数的 prototype 对象。比如 obj.__proto__ === Obj.prototype。
prototype 是每个函数对象才有的属性，它是一个对象，用于被实例的 __proto__ 所指向，从而共享方法和属性。

注意：__proto__ 已不推荐直接使用，应优先用 Object.getPrototypeOf(obj) 获取原型，用 Object.setPrototypeOf(obj, proto) 设置原型。

原型链是怎么形成的？

当你用构造函数创建一个对象时，JavaScript 自动把该对象的 __proto__ 指向构造函数的 prototype；而构造函数的 prototype 默认有一个 constructor 属性指回构造函数，并且它的 __proto__ 指向 Object.prototype；Object.prototype.__proto__ 的值是 null，链在此终止。

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

例如：

灵光

蚂蚁集团推出的全模态AI助手

1635

查看详情

function Person(name) { this.name = name; }
Person.prototype.sayHi = function() { return 'Hi'; };

const p = new Person('Alice');
// p.__proto__ === Person.prototype
// Person.prototype.__proto__ === Object.prototype
// Object.prototype.__proto__ === null

登录后复制

属性查找机制：沿着原型链向上找

当你访问一个对象的属性或方法时，JavaScript 引擎会：

先在对象自身上查找；
没找到，就去 __proto__ 指向的原型对象中找；
还没找到，继续沿原型链向上，直到 Object.prototype；
最后仍找不到，返回 undefined。

这就是为什么 p.toString() 能工作：虽然 p 自身没有 toString，但它从 Object.prototype 继承了这个方法。

现代替代方案与注意事项

ES6 引入了 class 语法，让原型链更易读，但底层仍是基于原型：

class Animal { constructor(name) { this.name = name; } }
class Dog extends Animal { bark() { return 'Woof!'; } }

登录后复制

这本质上等价于手动设置原型链。需注意：

箭头函数没有 prototype，不能作为构造函数；
原生类型如字符串、数字也有包装对象原型链（'abc'.toUpperCase() 就靠 String.prototype）；
修改原型会影响所有继承自它的实例（包括已创建的），要谨慎。

以上就是JavaScript原型链是什么以及如何理解它？的详细内容，更多请关注php中文网其它相关文章！

大家都在看：

javascript如何实现多线程_Web Worker有哪些使用限制为什么JavaScript的测试是必要的_有哪些流行的测试框架？ javascript中的服务端渲染如何工作_与客户端渲染有何不同 javascript的React Hooks是什么_如何使用useState和useEffect？怎样进行JavaScript国际化_多语言支持如何实现