Interfaces declare what functionality a type provides. A type or class is said to implement a certain interface if it provides
all the functionality that is defined in that interface. Types can implement any number of interfaces, but they can
only ever extend one other class at the maximum. This is similar to the behavior of interfaces in languages
like Java, C#, and TypeScript.
In yFiles for HTML however interfaces can also carry additional functionality that can be mixed-in into classes without
them having to implement that behavior themselves. This feature is known as “mixins” or “trait inheritance” from other
languages and is similar to what Java programmers can do with default implementations in interfaces and what C#
programmers can achieve with extension methods that work on interfaces.
This means that for a class to successfully implement an interface it needs to provide all the implementations of the
instance methods and instance properties that are declared as abstract by the interface. For all non-abstract
interface members the default implementation of the functionality available on the interface can be reused. For the
consumers of an API this means that the available functionality on a type is a lot more than just the implementations
that the type directly provides.
instanceof Checks for Interfaces
Checking whether an object instance implements a given interface can be done with the static isInstance(object)
method that is automatically provided by each interface type.
The standard JavaScript instanceof operator does not work for interfaces and enums in all browser. Therefore,
we recommend to always use the isInstance(object) method instead of the instanceof operator for checking for
interface implementation.
Implementing Interfaces
For this “mixin” and trait-inheritance feature to work as well as to properly declare the interface implementation to
the class framework with the JavaScript type system, the yFiles for HTML class framework needs to be used.
Depending on whether you are authoring your JavaScript code using TypeScript, ES2015 or ECMAScript Level 5,
different options exist.
For ES2015 implementing an interface so that it correctly works with the yFiles for HTML API is easy:
Using the yFiles class framework, interfaces can be implemented like this:
Class and BaseClass both take as arguments an optional base class and any number
of interfaces. When using JavaScript, Class and BaseClass are interchangeable, whereas in TypeScript only
BaseClass can be used. The base class argument may only reference a yFiles for HTML class or a class that inherits
from such a class using prototypal inheritance.
For more detailed background information about interfaces in the class framework, please see the section about
interfaces.
With pure ECMAScript Level 5 the same can be achieved in a little more verbose manner:
Quick Interface Implementation
For cases where a class declaration is not required and all that is needed is an instance
that implements a certain interface, there is a
short-hand syntax available that works for all levels and variants of JavaScript. If the interface only contains
a single abstract method, the function definition for that method can be directly passed to the interface type if
invoked as a constructor:
If the interface contains more than one abstract member or abstract properties, an options argument has to be used instead.
The options argument needs to contain exactly the abstract members of the interface. No member may be omitted and
no additional members can be added. While additional custom members can later be added directly on the instance, this
is discouraged.
Quick Interface Implementation in TypeScript
The TypeScript .d.ts file doesn’t contain typings that allow quick interface implementations via the interface constructor.
They still work at runtime, but the TypeScript compiler will produce an error nonetheless.
Because of that, many interfaces provide static create methods, which accept the same arguments as the interface
constructors. Whether an interface provides such a create method can be seen in the documentation viewer or in the
TypeScript .d.ts file.
Extending Classes and Implementing Interfaces
Sometimes it is necessary to both extend from an existing API class and at the same time add new interfaces
to the newly created subclass.