JavaScript: 揭秘原型和原型链的神秘面纱

2024-01-28 21:14:46

一、原型概述

在 JavaScript 中，每个对象都有一个原型对象，原型对象是一个特殊的对象，它包含了该对象的所有属性和方法。当一个对象被创建时，它会自动继承其原型对象的所有属性和方法。

原型对象可以通过 Object.getPrototypeOf() 方法来获取。例如：

const obj = {
  name: 'John',
  age: 30
};

const prototype = Object.getPrototypeOf(obj);

console.log(prototype); // { constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, … }

二、原型链

原型链是一条从对象到其原型对象的链。当一个对象访问一个属性或方法时，JavaScript 引擎会首先在该对象自身上线查找该属性或方法。如果找到了，则直接返回该属性或方法的值；如果没有找到，则会去改对象的原型上面继续查找。如果对象的原型上面也没有找到，则会继续往上查找，直到找到该属性或方法。

原型链可以帮助我们实现对象的继承。当一个对象继承另一个对象时，它会自动获得另一个对象的原型对象的所有属性和方法。例如：

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

Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

const person1 = new Person('John', 30);

person1.greet(); // Hello, my name is John and I am 30 years old.