JavaScript之原型与原型链

2024-02-15 02:20:40

前言

JavaScript作为一门灵活且强大的编程语言，在Web开发和构建交互式应用程序方面发挥着至关重要的作用。对于JavaScript开发者而言，深入理解原型和原型链的概念对于掌握对象和继承机制至关重要。本文将深入探讨JavaScript中的原型和原型链，帮助开发者对这些概念有更加深入的了解，以便更好地构建健壮且可维护的JavaScript应用程序。

核心概念

原型

在JavaScript中，每个对象都有一个内部属性**proto** ，指向该对象的原型。原型是一个对象，它包含着该对象可以访问的属性和方法。例如，如果有一个名为“person”的对象，它的**proto** 属性指向“Person”原型，这个原型包含了所有“person”对象都可以访问的属性和方法。

原型链

原型链是一个连接所有对象的链，从对象开始，沿着**proto** 属性向上延伸。当一个对象试图访问一个不存在于它自身中的属性或方法时，它会沿着原型链向上查找，直到找到该属性或方法。例如，如果“person”对象试图访问“name”属性，但“person”对象本身没有“name”属性，那么它会沿着原型链向上查找，直到找到“Person”原型，在“Person”原型中找到了“name”属性，并将其值返回给“person”对象。

特点

所有构造函数的**proto** 属性都指向Function.prototype 。
所有普通对象的**proto** 属性都指向Object.prototype 。
对象可以通过Object.create() 方法创建，该方法接受一个原型对象作为参数，并返回一个新对象，该新对象的**proto** 属性指向传入的原型对象。
对象可以使用**proto** 属性访问其原型的属性和方法。
对象可以使用instanceof 运算符来检查它是否属于某个原型。
原型链可以实现多重继承，即一个对象可以同时具有多个原型的属性和方法。

实例

// 创建一个Person原型
function Person(name) {
  this.name = name;
}

// 向Person原型中添加一个方法
Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name}`);
};

// 创建一个person对象
const person = new Person('John');

// person对象可以访问Person原型的属性和方法
console.log(person.name); // 'John'
person.greet(); // 'Hello, my name is John'

// 检查person对象是否属于Person原型
console.log(person instanceof Person); // true

// 创建一个Student原型，继承Person原型
function Student(name, major) {
  Person.call(this, name);
  this.major = major;
}

// Student原型继承Person原型的属性和方法
Student.prototype = Object.create(Person.prototype);

// 向Student原型中添加一个方法
Student.prototype.study = function() {
  console.log(`I'm studying ${this.major}`);
};

// 创建一个student对象
const student = new Student('Jane', 'Computer Science');

// student对象可以访问Person原型的属性和方法
console.log(student.name); // 'Jane'
student.greet(); // 'Hello, my name is Jane'

// student对象也可以访问Student原型的属性和方法
console.log(student.major); // 'Computer Science'
student.study(); // 'I'm studying Computer Science'

// 检查student对象是否属于Person原型和Student原型
console.log(student instanceof Person); // true
console.log(student instanceof Student); // true