JavaScript原型链详解与学习技巧

文章小白一枚，正在不断学习积累知识，现将学习到的知识记录一下，也是将我的所得分享给大家！而今天这篇文章《JavaScript原型链概念及理解方法》带大家来了解一下##content_title##，希望对大家的知识积累有所帮助，从而弥补自己的不足，助力实战开发！

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

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，链在此终止。

例如：

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原型链详解与学习技巧》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！