A lot of MDN pages describe things as "interfaces" - I was surprised that "interface" wasn't linked to a more explanatory page; it's just described as an "object type" on MDN's web APIs page.
An interface describes the shape of an object. (what properties it has, what type of values those properties contain, etc.) It's not an object itself - it's a more abstract description of what a particular object that implements the interface looks like.
For example, in the HTML standard, the DragEvent interface is described as such:
[Exposed=Window]
interface DragEvent : MouseEvent {
constructor(DOMString type, optional DragEventInit eventInitDict = {});
readonly attribute DataTransfer? dataTransfer;
};
dictionary DragEventInit : MouseEventInit {
DataTransfer? dataTransfer = null;
};
So DragEvent is a type of MouseEvent (which is another interface). It has a constructor function, so you can call new on window.DragEvent. When calling the constructor, you call it with the following arguments:
type, which is a DOMString (which is basically just any plain string)DragEventInit (which the documentation defines), which defaults to the empty objectA DragEvent instance also has a dataTransfer property
Note that the "interface" definition you're linking to is not exactly a JavaScript thing, but more of a thing for web APIs. In other implementations of JavaScript not in browsers (for example, in Node), an interface may mean something different (or nothing at all).
TypeScript, a widely used static type checker for JavaScript, has a very similar notion of interfaces, which describe the shape of a particular object. For example:
// Define the shape of a Foo object
interface Foo {
prop: string;
}
// Create an object that implements Foo
const someFoo: Foo = {
prop: 'somevalue'
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With