剖析对象原型、原型链与继承的奥秘

2023-12-15 05:29:11

前言

在JavaScript的世界中，对象原型、原型链和继承是三个紧密相关且至关重要的概念。理解它们对于构建可重用、可维护的代码至关重要。本文将带您深入了解这些概念及其在JavaScript中的应用。

对象原型

对象原型是JavaScript中每个对象固有的一项属性，它是一个特殊的对象，包含了该对象及其所有实例的共享属性和方法。可以通过以下两种方式访问对象原型：

使用Object.getPrototypeOf()方法。
使用__proto__属性（仅限非严格模式）。

例如：

const person = {
  name: "John Doe",
  age: 30,
};

const personPrototype = Object.getPrototypeOf(person);
console.log(personPrototype); // {constructor: ƒ}

console.log(person.__proto__); // {constructor: ƒ}

原型链

原型链是从一个对象到其原型对象的链条，它是JavaScript实现继承的一种机制。当我们访问一个对象的属性或方法时，JavaScript会首先在该对象中查找，如果找不到，则会沿着原型链向上查找，直到找到该属性或方法为止。

例如：

const person = {
  name: "John Doe",
  age: 30,
};

const student = Object.create(person);
student.major = "Computer Science";

console.log(student.name); // "John Doe"
console.log(student.age); // 30
console.log(student.major); // "Computer Science"

在上面的示例中，student对象继承了person对象的属性和方法，因为student对象的原型是person对象。

继承

继承是指一个对象从另一个对象或类中获取属性和方法的能力。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.`);
};

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

Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;

const student = new Student("John Doe", 30, "Computer Science");

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