Js module Daten global oder übergeben?

[Bennyaa]

Hallo, ich möchte gerne mein langsam unübersichtlich werdendes Projekt in Module aufteilen.
Zum einen bspw. Bestimmte Daten in ein Modul packen, oder die Events in ein Modul packen.
Hier stellt sich mir die Frage, wie die Daten zu übergeben sind.
Wenn ich bspw. Daten habe, welche aber durch die Funktion eines eventlisteners verändert werden, müsste dieser diese ja wieder irgendwie zurück geben, dass sie entsprechend in den Ursprungsorten verändert werden.
Oder eben alternativ greifen alle Module, welche diese Daten benötigen auf das Daten Modul zu.
Was haltet ihr für einen gängigen Weg?

 

[DHundt]

Hi, da gibt es im JavaScript mehrere Varianten.

Üblich ist z.B. am Daten "store" auch setter-Methoden zu haben und diese zu exportieren.

// store.js
const privateStore = {value: 42};

export function setValue(x) {
  privateStore.value = x;
}

// logics.js
import {setValue} from 'store.js';

setValue(23);

Du könntest auch mit einer by-reference Kette arbeiten, was aber schnell unübersichtlich wird

function a(x) {
   b(x);
}
function b(y) {
   y.value = 23;
}

const reference = {value: 42};
a(refrence);
// refrence.value ist 23

Oder mit callbacks.

const privateStore = {value: 42};

buildMyComponent({
  setValue(x) {privateStore.value = x;}
})

// b.js
function buildMyComponent(options) {
   options.setValue(23);
}

Benutzt du ein Framework oder weitere packages?

 

[tiga05]

Ich glaube nicht, dass ich die passende Antwort geben kann.
Aber als normaler Leser stellt sich vielleicht die Frage:
Ist das plain Javascript?
Oder nutzt du ein Framework?
Basierend darauf kann man dir vielleicht eine best practice Empfehlung geben

Allgemein benötigt es vielleicht noch ein wenig genauere Beschreibung.
Wieso willst du Daten in ein Modul packen? Das kann sinnvoll sein. Aber wo kommen die daten denn sonst her? Vielleicht lohnt es sich die daten als json abzulegen und einzulesen.
Grundsätzlich ist es sinnvoll, im Sinne der Objektorientierung, Services für Datenbeschaffung oder für eine Sammlung zu definieren. Aber vielleicht denke ich in dem Fall wieder zu sehr an mir bekannte Frameworks und die Antwort ist für deinen Fall somit wenig hilfreich.

 

[Bennyaa]

Danke schon mal für die Antworten.
Ich nutze kein Framework.
Möchte einfach das gesamte Projekt etwas aufteilen, damit man nicht so einen übersichtlichen Wust an Daten und Funktionen hat.
@DHundt dein erstes Beispiel ähnelt meinem.
Ich habe nur keine setter Funktion, sonder greife direkt auf die Struktur zu.

Importiere halt überall wo ich die Daten benötige das datanodule


Das 3. Beispiel finde ich persönlich irgendwie Strange. :-)

 

[DHundt]

Bei der ersten Variante hast du eine zentrale Sammelstelle, die du dynamisch importierst.

LogikA ------------> Store
      \--> LogikB -> Store

Bei der dritten Variante reichst du immer nur durch

Store <-- LogikA ---inject--> LogikB
                 \<-callback- LogikB

 

[Bennyaa]

Bei der ersten Variante hast du eine zentrale Sammelstelle, die du dynamisch importierst.

LogikA ------------> Store
      \--> LogikB -> Store

Bei der dritten Variante reichst du immer nur durch

Store <-- LogikA ---inject--> LogikB
                 \<-callback- LogikB

Ok, aber woher kennt Logik b denn den callback?
Die Funktion muss ja irgendwie bekannt sein.

Was ist denn in js. So am üblichsten? Variante 1, oder 3?