Anybody explain me what is the mean of this mdn article?

My problem is that I can’t understand Interfaces in javascript .
like: eventTarget interface , element inerface etc.

Can you talk about what parts you’re stuck on?

I don’t understand “EventTarget node element” diagram as you see in this picture .

" Element is the most general base class from which all element objects (i.e. objects that represent elements) in a Document inherit. It only has methods and properties common to all kinds of elements. More specific classes inherit from Element . For example, the HTMLElement interface is the base interface for HTML elements, while the SVGElement interface is the basis for all SVG elements. Most functionality is specified further down the class hierarchy"

And the defination of this paragraph in understandable way.

Ok. What parts do you understand? What brought you to this page?

interface.
what is the meaning of this diagram.
I only want to know the meaning of :point_right:t3:"interface":point_left:t3: word in this documentation.

It’s quite hard to understand for me .

Interface is how codes can talk to the computer, and how you can write the codes for it. If you do a quick Google, it actually defines it very well.
image

1 Like

Can you give me more explanation of this how they useful in javascript.

The MDN explained it well if you check all three of the topics linked to each other.

  • Element is just the very basic base of the HTML. <h1>, <p>, etc… Just HTML.
  • Node is how they are structured. So it’s basically controlling how elements should inherit properties from their parents. It is the structure of the HTML. Here’s a good image representing it:

  • EventTarget is just how the elements is able to receive an event and have a listener for the events.
1 Like

Yeah :sweat_smile:. So It’s related by the DOM, Is am I right?

Yes, that’s how the DOM access the Element, using Node Structuring.

Thank you very much brother for clear my confusion :hugs:

As far as I know, the word interface is from the specs where they are defined (for example interface-document) using the Web IDL language.

Web IDL

The WebIDL specification defines an interface definition language that can be used to describe interfaces that are intended to be implemented in web browsers.

Here is the start of the 3.2 Interfaces section:

3.2 Interfaces

IDL fragments are used to describe object oriented systems. In such systems, objects are entities that have identity and which are encapsulations of state and behavior. An interface is a definition (matching Interface or “callback” Interface) that declares some state and behavior that an object implementing that interface will expose.

interface identifier {
  interface-members…
};

An interface is a specification of a set of interface members (matching InterfaceMembers), which are the constants, attributes, operations and other declarations that appear between the braces in the interface declaration. Attributes describe the state that an object implementing the interface will expose, and operations describe the behaviors that can be invoked on the object. Constants declare named constant values that are exposed as a convenience to users of objects in the system.

It has little importance to you as a web developer and is an implementation detail.

Here is a brief definition from the C++ language:

Interfaces in C++ (Abstract Classes)

An interface describes the behavior or capabilities of a C++ class without committing to a particular implementation of that class.

1 Like