8 月进步之初：化繁为简，初识原型对象和原型链

2024-01-24 06:18:09







# 8 月进步之初：化繁为简，初识原型对象和原型链

在 JavaScript 的世界中，原型对象和原型链是两个重要的概念，也是面试官的必考知识点。为了在八月更文挑战中更进一步，让我们一起重新审视这些概念，用更简单的语言理解更深层次的原理。

## 原型对象：对象的始祖

每一个 JavaScript 对象都有一个原型对象，它充当该对象的始祖，拥有该对象的所有属性和方法。当我们使用 `new` 创建新对象时，JavaScript 会自动创建一个与该构造函数相关的原型对象。例如：

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

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

在这个例子中，Person 函数就是构造函数，它创建了一个原型对象，其中包含了 name 和 age 属性。当我们创建 person1 对象时，JavaScript 会自动将 Person 原型对象分配给 person1。

原型链：对象的继承关系

原型链是 JavaScript 中实现继承的一种方式。当一个对象访问一个它不拥有的属性或方法时，JavaScript 会沿着原型链向上查找，直到找到该属性或方法。例如：

person1.sayHello(); // TypeError: person1.sayHello is not a function

在这个例子中，person1 对象没有 sayHello() 方法，所以 JavaScript 会沿着原型链向上查找，找到 Person 原型对象，发现其中包含 sayHello() 方法，然后调用该方法。

实例方法与静态方法

原型对象上的方法称为实例方法，而直接定义在构造函数上的方法称为静态方法。实例方法可以通过对象实例访问，而静态方法则只能通过构造函数本身访问。例如：

Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}!`);
};

Person.staticMethod = function() {
  console.log('This is a static method.');
};

person1.sayHello(); // Hello, my name is John!
Person.staticMethod(); // This is a static method.