JavaScript原型继承_动力节点Java学院整理

关于JavaScript原型继承的

JavaScript中的原型继承是一个相当复杂但也非常强大的概念。在传统的基于Class的语言如Java、C++中，继承是扩展Class的方式，但在JavaScript中，由于采用的是原型继承，这一过程有所不同。

让我们回顾一下Student构造函数的定义及其原型方法：

```javascript

function Student(props) {

this.name = props.name || 'Unnamed';

}

Student.prototype.hello = function () {

alert('Hello, ' + this.name + '!');

}

```

现在，我们想要基于Student构造函数创建一个新的构造函数PrimaryStudent，并希望它继承Student的属性和方法。为此，我们需要定义一个中间对象作为桥梁来连接PrimaryStudent和Student的原型。这样，我们可以确保PrimaryStudent创建的对象的原型链正确指向Student的原型。

这里是具体的实现步骤：

1. 首先定义PrimaryStudent构造函数并调用Student构造函数来绑定this变量并初始化必要的属性：

```javascript

function PrimaryStudent(props) {

Student.call(this, props); // 调用Student构造函数，绑定this变量并初始化属性

this.grade = props.grade || 1; // 定义特有的属性grade

}

```

2. 然后，我们需要创建一个中间对象，它的原型指向Student的原型，并将PrimaryStudent的原型指向这个中间对象：

```javascript

// 创建一个空对象作为中介者原型指向Student的原型

var的中介对象 = Object.create(Student.prototype); // 创建中介对象并指向Student的原型

中介对象.constructor = PrimaryStudent; // 设置中介对象的构造函数为PrimaryStudent以满足构造函数的完整性需求

PrimaryStudent.prototype = 中介对象; // 将PrimaryStudent的原型指向中介对象以继承Student的属性和方法。现在我们可以扩展PrimaryStudent独有的方法或属性。这将允许新创建的PrimaryStudent实例同时访问其自己的属性和方法以及从Student继承的属性和方法。通过这种方式，我们实现了JavaScript中的原型继承。需要注意的是，直接设置PrimaryStudent.prototype = Student.prototype是不正确的做法，因为这样会导致所有PrimaryStudent实例和Student实例共享同一个原型对象，从而破坏了它们应有的独立性。我们必须使用中介对象来确保正确的原型链和继承关系。通过这种方式实现的原型继承使JavaScript能够以灵活和强大的方式支持基于原型的编程模式。在JavaScript的世界里，实现原型继承是一个重要的概念，特别是在构建复杂的应用时。今天，我们将以道爷（JSON之父道格拉斯）的代码为灵感，如何使用原型继承来扩展我们的代码结构。这不仅是一种代码的组织方式，也是一种保持代码整洁、清晰的策略。让我们深入了解一下这个过程。

我们有一个基础的`Student`构造函数，用于创建学生对象。然后，我们想要创建一个`PrimaryStudent`对象，这是一个特殊的学生对象，它包含额外的属性如年级等级。我们想要避免重新编写所有的代码，因此我们想要使用原型继承来利用`Student`对象的功能。这就需要借助一个空函数`F`来建立连接。

这是我们的代码实现：

首先定义`PrimaryStudent`构造函数并调用父级构造函数`Student`，设定新的属性`grade`。接着定义了空函数`F`并设置其原型为`Student.prototype`。之后我们将`PrimaryStudent`的原型设置为一个新的`F`对象实例，使得其原型链指向了`Student.prototype`。然后修复了原型上的构造函数引用，确保原型链的正确性。最后我们在`PrimaryStudent`原型上定义了新的方法如获取年级的方法。至此我们完成了原型链的构建和方法的扩展。这就是原型继承的核心步骤。为了简化这一过程，我们封装了一个强大的函数 `inherits()` ，隐藏了中间的复杂过程。