JavaScript 中的原型链是一种对象之间的关系模型,它用于实现继承和共享属性。理解原型链对于深入了解 JavaScript 对象和面向对象编程是非常重要的。

1. 对象和原型:

在 JavaScript 中,每个对象都有一个原型(prototype),并且它可以通过 __proto__ 属性访问到它的原型对象。
let object = {}; // 创建一个空对象
console.log(object.__proto__); // 原型对象

2. 原型链:

原型链是通过对象的原型对象链接起来的,形成一个链式结构。当我们访问一个对象的属性时,如果该对象没有这个属性,JavaScript 就会沿着原型链去查找这个属性,直到找到或者到达原型链的顶端(Object.prototype)。
let person = {
  name: 'John',
  sayHello: function() {
    console.log('Hello, ' + this.name);
  }
};

let student = {
  major: 'Computer Science'
};

// 将 student 对象的原型设置为 person 对象
student.__proto__ = person;

// 访问 student 对象的属性和方法
console.log(student.name); // 通过原型链访问 person 对象的属性
student.sayHello(); // 通过原型链调用 person 对象的方法

3. 构造函数和原型链:

构造函数是创建对象的一种方式,每个构造函数都有一个原型对象。通过构造函数创建的对象会将其原型对象指向构造函数的原型。
function Animal(name) {
  this.name = name;
}

// 通过构造函数创建对象
let cat = new Animal('Fluffy');

console.log(cat.__proto__); // Animal 的原型对象
console.log(cat.__proto__.__proto__); // Object 的原型对象

4. 原型链的终点:

所有对象的原型链最终都会指向 Object.prototype。Object.prototype 是原型链的顶端,它是所有对象的基础。
console.log(Object.prototype.__proto__); // null,原型链的终点

5. 继承和原型链:

原型链实现了对象之间的继承关系。子对象通过原型链可以访问到父对象的属性和方法,实现了属性和方法的共享。
function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function() {
  console.log('Hello, ' + this.name);
};

function Student(name, major) {
  Person.call(this, name); // 调用父构造函数,初始化父对象的属性
  this.major = major;
}

// 将 Student 的原型设置为 Person 的实例,实现继承
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student; // 修正构造函数指向

let student = new Student('Alice', 'Math');
student.sayHello(); // 继承自 Person 的方法

以上是关于 JavaScript 原型链的基本理解。原型链是 JavaScript 中实现继承和对象共享的重要机制,掌握原型链有助于更好地理解 JavaScript 中的对象和面向对象编程。


转载请注明出处:http://www.pingtaimeng.com/article/detail/3587/JavaScript