Ejemplo de mecanismo de herencia de ECMAScript

Esta sección utiliza un ejemplo clásico para explicar el mecanismo de herencia de ECMAScript.

Ejemplo de mecanismo de herencia

La forma más sencilla de explicar el mecanismo de herencia es utilizando un ejemplo clásico: las figuras geométricas. En realidad, solo hay dos tipos de figuras geométricas, elípticas (que son círculos) y polígonos (que tienen un número determinado de lados). El círculo es un tipo de elíptico, y tiene un solo foco. El triángulo, el rectángulo y el pentágono son tipos de polígonos, con un número diferente de lados. El cuadrado es un tipo de rectángulo, y todos sus lados son iguales. Esto constituye una relación de herencia perfecta.

En este ejemplo, Shape es la clase base (base class) de Ellipse y Polygon (de la que todas las clases heredan). El elíptico tiene una propiedad focosindicando el número de focos que tiene el elíptico. El círculo (Circle) hereda del elíptico, por lo que el círculo es una subclase del elíptico (subclass), y el elíptico es la superclase (superclass). Del mismo modo, el triángulo (Triangle), el rectángulo (Rectangle) y el pentágono (Pentagon) son subclases de los polígonos, y los polígonos son sus superclases. Finalmente, el cuadrado (Square) hereda del rectángulo.

Es mejor explicar esta relación de herencia con un gráfico, aquí es donde entra en juego el UML (Lenguaje de Modelado Unificado). Uno de los principales usos del UML es representar visualmente relaciones complejas como la herencia. A continuación se muestra un diagrama UML que explica la relación entre Shape y sus subclases:

Ejemplo de diagrama UML de mecanismo de herencia

En UML, cada cuadro representa una clase, explicada por el nombre de la clase. Las líneas rectas en la punta de los triángulos, rectángulos y pentágonos se juntan en una dirección hacia la forma, lo que indica que estas clases heredan de la forma. Del mismo modo, la flecha que apunta desde el cuadrado hacia el rectángulo indica la relación de herencia entre ellos.