HTML und Javascript OOP

[Rolf B]

Hallo Jo,

kommt drauf an. Hast Du Dich schon mit dem Modul-Pattern in JavaScript beschäftigt? Mit diesem Pattern kannst du zumindest dafür sorgen, dass die Daten nicht superglobal herumliegen, sondern nur in einem einzelnen Modul, das für ihre Verarbeitung erforderlich ist.

Module gibt es klassisch über define-/require Funktionen (nach der Idee von CommonJS), z.B. unterstützt durch JS Libs wie require.js - aber da willst Du ja 'runter :)

ES 2015 führt über import/export ebenfalls ein Modulsystem ein. Wenn Du das in älteren Browsern nutzen willst (insbes. IE11), brauchst Du einen Transpiler (Typescript, Traceur, Babel etc).

Oder Du schreibst einen einfachen manuellen Modulmanager, der dann dein einziges globales Objekt sein müsste. Den lädst Du zuerst, und alle deine Module registrieren sich dort.

Die Idee ist jedenfalls, dass jedes Modul in einer IIFE gekapselt ist und ein Objekt zurückgibt, das das Modul repräsentiert. Das kann eine Konstruktorfunktion sein, ein HTML Template oder ein Objekt mit irgendwelchen Helper-Funktionen. Irgendeine orchestrierende Komponente muss dann wissen, welches Modul welches andere Modul referenziert und stellt die Modulobjekte bereit - oder es gibt einfach einen großen Topf an vorhandenen Modulen und jedes Modul greift bei seiner Initialisierung in diesen Topf und holt sich die benötigten Modulobjekte heraus. Die Herausforderung ist dann, die richtige Initialisierungsreihenfolge zu finden.

Rolf