JavaScript原型与原型链深入浅出_javascript技巧

原型是函数的prototype属性指向的对象，每个对象通过[[Prototype]]链接向上查找属性，形成原型链：p1→Person.prototype→Object.prototype→null，实现继承与共享。

JavaScript中的原型与原型链是理解对象继承和属性查找机制的核心。很多人初学时觉得抽象，其实只要抓住几个关键点，就能快速掌握它的运行逻辑。

什么是原型（Prototype）？

在JavaScript中，每一个函数创建时都会自动生成一个prototype属性，这个属性指向一个对象，称为“原型对象”。而每个对象（除部分特殊情况外）都有一个内部属性[[Prototype]]，它指向其构造函数的prototype。

例如：

function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function() {
  console.log("Hello, I'm " + this.name);
};

const p1 = new Person("Alice");
p1.sayHello(); // 输出: Hello, I'm Alice

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

这里，p1本身没有sayHello方法，但它能调用，是因为JavaScript通过原型找到了Person.prototype上的该方法。

原型链：属性查找的路径

当访问一个对象的属性时，JavaScript会先检查对象自身是否有这个属性。如果没有，就会沿着[[Prototype]]链向上查找，直到找到匹配属性或到达原型链末端（即null）。

比如：

百川大模型

百川智能公司推出的一系列大型语言模型产品

62

查看详情

• p1.toString() —— p1没有toString，但它的构造函数原型继承自Object.prototype，所以能找到。
• 这条查找路径就是：p1 → Person.prototype → Object.prototype → null

这就是原型链的本质：一条由[[Prototype]]连接起来的对象链条。

如何查看和设置原型？

现代JavaScript提供了几个常用方法来操作原型：

• Object.getPrototypeOf(obj) —— 获取对象的原型
• Object.setPrototypeOf(obj, prototype) —— 设置对象的原型（性能较低，慎用）
• obj.__proto__ —— 非标准但广泛支持的访问方式（可读可写）
• Object.create(prototype) —— 创建一个新对象，并指定其原型

推荐使用Object.getPrototypeOf和Object.create来保证代码的规范性和兼容性。

常见误区与实用技巧

理解原型链时，有几个容易混淆的地方：

• prototype是函数才有的属性；而[[Prototype]]是每个对象都有的内部链接
• 箭头函数没有prototype属性
• 使用class语法定义的类，底层依然是基于原型实现的

小技巧：如果你想让多个实例共享某个方法或数据，把它挂到prototype上，而不是定义在构造函数内部，这样更节省内存。

基本上就这些。原型不是魔法，只是JavaScript对象之间通过链接共享属性和方法的一种机制。搞清楚谁连着谁，查找顺序是什么，自然就通了。不复杂但容易忽略细节。

以上就是JavaScript原型与原型链深入浅出_javascript技巧的详细内容，更多请关注php中文网其它相关文章！