JavaScript中的原型与原型链

什么是原型

在JavaScript中，每个对象都有一个特殊的隐藏属性[[Prototype]]（可以通过__proto__访问），它要么是另一个对象，要么是null。这个隐藏属性就是对象的"原型"。

当我们试图读取一个对象的属性时，如果对象本身没有这个属性，JavaScript会自动从它的原型中查找，这就是所谓的"原型继承"。

let animal = {  eats: true};let rabbit = {  jumps: true};rabbit.__proto__ = animal; // 设置rabbit的原型为animal// 现在rabbit可以访问animal的属性console.log(rabbit.eats); // trueconsole.log(rabbit.jumps); // true

原型链

原型可以形成一个链式结构，称为"原型链"。当属性在对象本身找不到时，JavaScript会沿着原型链向上查找：

let animal = {  eats: true,  walk() {    console.log("Animal walk");  }};let rabbit = {  jumps: true,  __proto__: animal};let longEar = {  earLength: 10,  __proto__: rabbit};// 方法调用从原型链中获得longEar.walk(); // Animal walkconsole.log(longEar.jumps); // true (从rabbit获得)

函数原型

每个函数都有一个prototype属性（注意不是__proto__），这个属性在函数作为构造函数使用时特别重要。

function Person(name) {  this.name = name;}Person.prototype.sayHello = function() {  console.log(`Hello, my name is ${this.name}`);};let john = new Person("John");john.sayHello(); // Hello, my name is John

原型相关方法

JavaScript提供了一些方法来操作和检查原型：

let obj = {};let parent = { x: 1 };// 设置原型Object.setPrototypeOf(obj, parent);// 获取原型console.log(Object.getPrototypeOf(obj) === parent); // true// 检查属性是否属于对象自身console.log(obj.hasOwnProperty('x')); // falseconsole.log(parent.hasOwnProperty('x')); // true// 检查对象是否在另一个对象的原型链上console.log(parent.isPrototypeOf(obj)); // true

现代原型操作

虽然__proto__被广泛支持，但现代JavaScript推荐使用以下方法：

let animal = {  eats: true};// 创建以animal为原型的新对象let rabbit = Object.create(animal);console.log(rabbit.eats); // true// 获取原型console.log(Object.getPrototypeOf(rabbit) === animal); // true// 设置原型Object.setPrototypeOf(rabbit, {});console.log(rabbit.eats); // undefined

理解原型和原型链是掌握JavaScript对象模型的关键，它是JavaScript实现继承和共享属性的核心机制。