剖析JS中原型和原型链的概念与本质，深入理解对象继承的机制

前端

2023-09-28 17:02:18

浅谈原型，理清原型链 #

在JavaScript中，原型是一个对象，它定义了其他对象可以继承的属性和方法。而原型链则是指从一个对象到其原型再到原型原型，依次往上查找属性和方法的过程。

理解原型和原型链

为了更深入地理解原型和原型链，我们先来了解几个基本概念：

原型(prototype)： 每个对象都有一个原型，它是一个普通的JavaScript对象，用于继承属性和方法。
原型链(prototype chain)： 原型链是对象的查找路径，当一个对象试图访问一个不存在的属性或方法时，就会沿着原型链向上查找，直到找到该属性或方法，或者到达最顶层的Object对象。
_proto_属性： 每个对象都有一个_proto_属性，它指向对象的原型。
constructor属性： 每个对象都有一个constructor属性，它指向对象的构造函数。

原型和原型链的实际运用

原型和原型链在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);
const person2 = new Person('Mary', 25);

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

在这个例子中，Person函数是一个构造函数，它创建了Person对象。Person.prototype是一个对象，它定义了Person对象的原型。Person.prototype.greet是一个方法，它定义了Person对象的方法。当我们调用person1.greet()或person2.greet()时，JavaScript会沿着原型链向上查找greet方法，直到找到它并执行它。