JavaScript原型链示例分享

当然，我可以分享一个关于JavaScript原型链的简单示例。在这个示例中，我们将创建两个构造函数，`Person` 和 `Student`，其中 `Student` 继承自 `Person`。通过这个过程，我们可以清晰地看到原型链是如何工作的。

// 定义一个Person构造函数
function Person(name, age) {
    this.name = name;
    this.age = age;
}

// 为Person原型添加一个方法
Person.prototype.sayHello = function() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

// 定义一个Student构造函数，继承自Person
function Student(name, age, grade) {
    // 调用Person构造函数
    Person.call(this, name, age);
    this.grade = grade;
}

// 设置Student的原型为Person的一个实例
Student.prototype = Object.create(Person.prototype);

// 修正constructor指向，因为Object.create会改变constructor的指向
Student.prototype.constructor = Student;

// 为Student原型添加一个特有的方法
Student.prototype.showGrade = function() {
    console.log(`I am in grade ${this.grade}.`);
};

// 创建Person和Student的实例
var person1 = new Person('Alice', 30);
var student1 = new Student('Bob', 20, 10);

// 调用方法
person1.sayHello(); // 输出: Hello, my name is Alice and I am 30 years old.
student1.sayHello(); // 输出: Hello, my name is Bob and I am 20 years old.
student1.showGrade(); // 输出: I am in grade 10.

在这个示例中，`Student` 通过设置其 `prototype` 为 `Person.prototype` 的一个新实例来继承 `Person`。这样，`Student` 的实例就可以访问到 `Person` 原型上定义的方法和属性了。同时，我们通过 `Student.prototype.constructor = Student;` 来修正了 `constructor` 的指向，确保它正确地指向了 `Student` 构造函数。最后，我们展示了如何通过原型链访问继承的方法，并展示了如何在子类型的原型上添加新的方法。