So nennen Sie eine JavaScript -Klassenmethode aus einer anderen Klasse [geschlossen] ⇐ JavaScript

[Anonymous]

Ich habe eine JavaScript -Klasse, die jede Instanz an ein DOM -Objekt angeschlossen ist. Diese Klasse enthält eine Methode, um das DOM -Objekt zu verbergen. Zum Beispiel
Index.html

Code: Select all

Content

Main.js

Code: Select all

class MyClass {
constructor(element)
{
this.component = element;
}

hideElement()
{
this.component.classList.add('hidden');
}
}

let myDiv = new MyClass(document.getElementById("myDomObject");

Ich habe eine Reihe anderer Klassen, die das gleiche DOM -Objekt nach etwas ausblenden, z. B. das Klicken einer Schaltfläche oder das Ergebnis einer AJAX -Anforderung. /> Main2.js
class MySecondClass {
constructor(element)
{
this.component = element;
this.addClickEvent(some_button);
}

addClickEvent(element)
{
element.addEventListener('click', function()
{
document.getElementById("myDomObject").classList.add('hidden');
}
}
}

let myButton = new MySecondClass('some-button');
< /code>
Es fühlt sich nicht richtig an, die gleiche Methode in jedem meiner Klassen immer wieder neu zu erstellen, nur um die Methode der ursprünglichen Klasse zu replizieren. Das ist nicht sehr trocken. Ich möchte die Methode "Hide" dieser ursprünglichen Klasse < /p>
Ich habe dies wie unten versucht. PrettyPrint-Override ">class MySecondClass {
constructor(element)
{
this.component = element;
this.addClickEvent(some_button);
this.domObject = new MyClass(document.getElementById("myDomObject");
}

addClickEvent(element)
{
element.addEventListener('click', function()
{
this.domObject.hide();
}
}
}
< /code>
Dies instanziiert offensichtlich mehrere Instanzen der Hauptklasse. Wenn ich zehn andere Klassen habe, werde ich diese zehn Klassen und dann zehn Fälle der Hauptklasse anrufen. Ereignishörer werden zehnmal zum DOM -Objekt usw. hinzugefügt.>