【JavaScript系列】原型继承和原型链

o-O-oO / 2024-08-23 / 原文

原创 IT知识一享

原型继承

在 JavaScript 中，每个函数都有一个特殊的属性叫做 prototype（原型）。当你用 new 关键字来创建一个对象实例时，这个实例会自动关联到构造函数的 prototype 上。

const Person = function(firstName, birthYear) {
  this.firstName = firstName;
  this.birthYear = birthYear;
};

通过 new Person('IT知识一享', 2024) 创建了一个 ItShare 对象实例。这个实例 ItShare 会有一个隐藏属性 __proto__，它指向 Person.prototype，即 Person 函数的原型对象。

原型链

原型链是一种机制，允许对象通过它们的原型链查找和继承属性和方法。如果在一个对象上访问属性或方法时，对象本身没有定义，JavaScript 引擎会沿着这个对象的 __proto__（即它的构造函数的 prototype）向上查找，直到找到对应的属性或方法或者到达原型链的顶端（即 Object.prototype）。

【eg】：

console.log(ItShare instanceof Person);

true，原因是ItShare 是 Person 的实例；

ItShare.CalcAge(); /

输出 75，通过原型继承，ItShare 实例可以访问到 Person.prototype 上的 CalcAge 方法

.__proto__ === Person.prototype); // true，ItShare 的 __proto__ 指向 Person.prototype

console.log(Person.prototype.isPrototypeOf(ItShare)); // true，Person.prototype 是 ItShare 的原型

console.log(Person.prototype.isPrototypeOf(Person)); // false，Person.prototype 不是 Person 函数自身的原型对象

重点理解

原型对象：每个函数在创建时都有一个 prototype 属性，它指向一个对象，这个对象包含函数的默认属性和方法。

实例的原型：通过 new 关键字创建对象实例时，实例会有一个 __proto__ 属性，指向构造函数的 prototype。

原型链：通过原型链，对象可以访问其构造函数的原型对象上定义的属性和方法。

isPrototypeOf 方法：用于检查一个对象的原型链中是否包含另一个对象的原型。