Kapselung Function (JavaScript)

[Phoenix]

Zitat von ATS3788:

Mich wundert es nur wie die in JS ein Objekt kapseln,
wenn man das so sagen kann

Okay, fangen wir mal von vorne an: In JavaScript ist in erster Linie erstmal alles ein Object.

Code:

var myString = "Test";

myString ist also schon ein Object.

Komplexe Objekte können auf mehrere Arten erstellt werden. Das was Du da anscheinend versuchst, ist das Objekt direkt komplett zu erzeugen (aber ohne Klasse!):

Code:

var myComplexObject = {
   test: "Property of type string",
   test2: 4,
   makeSomething: function() {
      return "bar";
   }
}; // hier wird myComplexObject gleich das JSON-Object zugewiesen

var foo = myComplexObject.makeSomething(); // foo hat den Wert bar

Was Du aber eigentlich vermutlich machen willst, ist eine (Constructor-) Funktion zu schreiben, die Dir ein Objekt vom Typ Robot zurück gibt. Diese wären auch via Konvention groß geschrieben (normale Funkionen und properties per Konvention alles klein).

Das würde so aussehen:

Code:

// definieren der constructor-Funktion
var Robot = function(domElementName) {
   this.div = window.document.getElementById(domElementName);
   this.frameHeight = 150;
   this.frames = 10;
   this.offsetY = 0;
   this.OffOn = false;

   this.animate = function() { ... };
   this.stop = function() {...};

   return this;  // ist optional, this wird sonst in der ctor-Funktion immer zurückgegeben
};

var myRobot = new Robot("robot"); // hier wird eine Instanz der Klasse 'Robot' für das übergebene Div erzeugt
myRobot.animate(); // animation starten...

myRobot.stop();
myRobot = null; // hier wird die instanz wieder freigegeben 'löschen'
delete myRobot; // alternativ kann auch die (globale) variable komplett entfernt werden

Mit dieser Variante würden die Einstellungen wie offset und frames public sein, und könnten von aussen verwendet werden.
Willst Du diese Kapseln (also sozusagen private machen), dann würdest Du sie als closure verwenden:

Code:

var Robot = function(domElementName) {
   var div = window.document.getElementById(domElementName);
   var frameHeight = 150;
   var frames = 10;
   var offsetY = 0;
   var OffOn = false;

   this.animate = function() { ... };
   this.stop = function() {...};

   return this;  // ist optional, this wird sonst in der ctor-Funktion immer zurückgegeben
};

Die Variablen wie div, frameHeight, frames etc. existieren nur innerhalb der Konstruktorfunktion und können von den dort definierten Funktionen wie animate verwendet werden. Aber sie sind nach aussen hin nicht sichtbar, da sie nicht auf 'this' (also das Objekt selber) gesetzt werden.

Ich empfehle als Lektüre zu JavaScript im übrigen "JavaScript: The Good Parts" von Douglas Crockford. Dort lernst man alle sinnvollen und guten Features im Detail kennen und auch, welche man tunlichst nicht nutzen sollte (die bad parts ).