Javascript继承实现示例

1.要创建基类，首先考虑多边形类。需要哪些属性和方法？首先要知道一个多边形的边数，所以要加上整数属性边。多边形还需要什么？也许你想知道一个多边形的面积，那么加入getArea()方法来计算面积。图4-3显示了这个类的UML表示。

图4-3

在UML中，属性由属性名称和类型表示，并且位于类名正下方的单元中。方法位于属性下，描述方法名称和返回值的类型。在ECMAScript中，可以编写如下类：。

请注意，多边形类还不够详细和准确，无法使用。方法getArea()返回0，因为它只是子类重写的占位符。2.创建子类现在考虑创建一个三角形类。三角形有三条边，因此该类必须覆盖多边形类的“边”属性，并将其设置为3。覆盖getArea()方法，使用三角形的面积公式，即1/2底高。但是如何获得最终的高价值呢？这两个值需要专门输入，所以必须创建基础属性和高度属性。三角形类的UML表示如图4-4所示。该图只显示了三角形类的新属性和覆盖的方法。如果Triangle类没有重写getArea()方法，它将不会在图表中列出。它将被视为从多边形类中保留的方法。完整的UML图还显示了多边形和三角形类之间的关系(图4-5)，这使得它更加清晰。

在UML中，继承的属性和方法永远不会被重复显示，除非方法被覆盖(或者重载，这在ECMAScript中是不可能的)。三角类的代码如下：。

请注意，虽然多边形的构造函数只接受一个参数边，但三角形类的构造函数接受两个参数，即底部和高度。因为这个三角形的边数是已知的，开发者不想改变。因此，当使用对象模拟时，3作为对象的边数传递给多边形的构造函数。然后，将底部和高度的值分配给适当的属性。用原型链继承方法后，Triangle将覆盖getArea()方法，并为三角形面积提供自定义计算。最后一个类是矩形，它也继承了多边形。矩形有四条边，面积按长宽计算。长度和宽度成为这个类的必要属性。在前面的UML图中，矩形类应该填充在三角形类的旁边，因为它们的超类是多边形(如图4-6所示)。

图4-6矩形的ECMAScript代码如下：。

请注意，矩形构造函数不将边作为参数，同样，常数4直接传递给多边形构造函数。像三角形一样，矩形引入了两个新的属性作为构造函数的参数，然后重写了getArea()方法。测试代码您可以运行以下代码来测试为该示例创建的代码。

这段代码创建了一个底部为12、高度为4的三角形，以及一个长度为22、宽度为10的矩形。然后输出每个形状的边数和面积，证明边属性的赋值是正确的，getArea()方法返回正确的值。三角形的面积应为24，矩形的面积应为220。4.采用动态原型法怎么样？在前面的例子中，继承机制是通过对象定义的混合构造函数/原型模式来演示的，那么动态原型可以用来实现继承机制吗？不能。继承机制不能是动态的原因是原型对象的独特性。看看下面这段代码(这段代码不正确但值得研究):。

上面的代码显示了由动态原型定义的多边形和三角形类。错误在于设置Triangle.prototype属性的高亮代码。从逻辑上讲，这个立场是正确的，但从功能上讲，它是无效的。从技术上讲，在代码运行之前，对象已经被实例化并与原始原型对象链接。虽然很晚绑定可以正确反映原型对象的修改，但是替换原型对象不会对其产生任何影响。只有未来的对象实例会反映这种变化，这使得第一个实例不正确。为了使用动态原型正确实现继承机制，必须在构造函数之外给出一个新的原型对象，如下所示：。

这段代码是有效的，因为原型对象是在实例化任何对象之前分配的。不幸的是，这意味着这些代码不能完全封装在构造函数中，这就是动态原型的目的。