nicht angemeldet
OOP: Methode rekursiv aufrufen
Hallo!
Ich versuche grad einige oft benutze Funktionen in einer Bibliothek zu bündeln. Nun möchte ich aber zwei Fliegen mit einer Klappe schlagen und das ganze Projekt objektorientiert umsetzen. Viele meiner Funktionen rufen sich rekursiv auf z.B.:
function ssmoveRight(id,nx,step,ms) {
mr = 0;
cx = document.getElementById(id).style.left;
cx = cx.split("p");
stepx = (cx[0]*1)+step;
if ((stepx <= nx) && (ml == 0)) {
mr = 1;
document.getElementById(id).style.left = stepx;
cmd = "ssmoveRight('"+id+"',"+nx+","+step+","+ms+")";
window.setTimeout (cmd,ms);
}
}
Nun stehe ich völlig auf dem Schlauch und finde keinen Ansatz diesen rekursiven Aufruf objektorientiert umzusetzen.
Für Hilfe wäre ich sehr dankbar.
Der Shane
P.S.: Weiß jemand wie es mit der Performance OOP vs. Prozedur in JS steht? Wäre es vielleicht besser das ganze prozedural zu lassen?
-
Hellihello Shane,
Ich versuche grad einige oft benutze Funktionen in einer Bibliothek zu bündeln. Nun möchte ich aber zwei Fliegen mit einer Klappe schlagen und das ganze Projekt objektorientiert umsetzen. Viele meiner Funktionen rufen sich rekursiv auf z.B.:
function ssmoveRight(id,nx,step,ms) {
mr = 0;
cx = document.getElementById(id).style.left;
cx = cx.split("p");
stepx = (cx[0]*1)+step;
if ((stepx <= nx) && (ml == 0)) {
mr = 1;
document.getElementById(id).style.left = stepx;
cmd = "ssmoveRight('"+id+"',"+nx+","+step+","+ms+")";
window.setTimeout (cmd,ms);
}
}Nun stehe ich völlig auf dem Schlauch und finde keinen Ansatz diesen rekursiven Aufruf objektorientiert umzusetzen.
Für Hilfe wäre ich sehr dankbar.
Wegen der Schreibweise s.a. https://forum.selfhtml.org/?t=164832&m=1074652.
Ansonsten hilft vielleicht das Wörtchen "this"?
<html> <head> <title>oop js this self</title> <script type="text/javascript"> [code lang=javascript] window.onload=function() { my_div=document.getElementById("my_id"); my_div.innerHTML="window onload war am werk"; My_Object.method2(); } My_Object={}; My_Object.method1=function() { my_div.innerHTML="method1 war am werk"; } My_Object.method2=function() { alert("hallo"); this.method1(); }</script>
</head>
<body>
<div id="my_id">default
</div>
</body>
</html>
[/code]Dank und Gruß,
-
Hallo frankx,
erstmal vielen Dank für die Antwort und für den Link. Ich glaub ich habs, dank Dir und deinem Script, raus. setTimeout(this.methode(nx,step,ms),ms) (funktioniert so nicht, ich weiß, nur zur Anschauung :-) sollte eigentlich die Lösung sein. Ich versuche es heute mal umzusetzen. Ich melde mich hier sobald es funktioniert.
Bis dann,
Shane
-
n'abend,
erstmal vielen Dank für die Antwort und für den Link. Ich glaub ich habs, dank Dir und deinem Script, raus. setTimeout(this.methode(nx,step,ms),ms) (funktioniert so nicht, ich weiß, nur zur Anschauung :-) sollte eigentlich die Lösung sein. Ich versuche es heute mal umzusetzen. Ich melde mich hier sobald es funktioniert.
Was du da machst, ist ja auch nicht das, was du machen willst (es sei denn this.methode() gibt ein Funktionsobjekt zurück). Wenn du das mal in zwei Zeilen aufdröselst, wird dir vielleicht auch klar warum:
var callback = this.methode(nx,step,ms); window.setTimeout( callback, ms );Wir merken, dass zu diesem Zeitpunkt this.methode() bereits ausgeführt wurde und du den Rückgabewert als Funktionsaufruf an window.setTimeout() übergibst. Probier mal folgendes:
var callback = function(){ this.methode(nx,step,ms); }; window.setTimeout( callback, ms );Vielleicht möchtest du mal einen Blick in Organisation von JavaScripten von Olmily™ werfen?
weiterhin schönen abend...
--
#selfhtml hat ein Forum?
sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|-
Hallo,
var callback = function(){ this.methode(nx,step,ms); };
window.setTimeout( callback, ms );
Das wird nicht gehen, weil callback im globalen Kontext ausgeführt wird, d.h. this zeigt nicht auf das Objekt, sondern auf das globale Objekt window. > Vielleicht möchtest du mal einen Blick in [Organisation von JavaScripten](http://aktuell.de.selfhtml.org/artikel/javascript/organisation/) von Olmily™ werfen? Ja, da werden [Closures](http://aktuell.de.selfhtml.org/artikel/javascript/organisation/#closures) als Lösung vorgestellt. ~~~javascript /* Im Objektkontext: */ var thisObject = this; var callback = function () { // In dieser verschachtelten Funktion ist thisObject verfügbar (»eingeschlossen«), // dasselbe gilt für nx, step und ms thisObject.methode(nx, step, ms); };Mathias
-
Hallo globe und molily,
vielen Dank für eure Mühe. Ich glaube ich hab OOP-Konzept noch nicht ausreichend verinnerlicht um mein Projekt erfolgreich zu beenden. Ich fühl mich grad etwas überfordert. Werde mal meine FH-Bibo nach Büchern zum Thema durchforsten und mich aus dem Urschleim hocharbeiten :-) Vielleicht könnt ihr mir noch ein paar gute Tutorials empfehlen? Ob Deutsch oder Englisch ist dabei egal.
Vielen Dank,
der Shane
-
Hallo,
vielen Dank für eure Mühe. Ich glaube ich hab OOP-Konzept noch nicht ausreichend verinnerlicht um mein Projekt erfolgreich zu beenden. Ich fühl mich grad etwas überfordert. Werde mal meine FH-Bibo nach Büchern zum Thema durchforsten und mich aus dem Urschleim hocharbeiten :-) Vielleicht könnt ihr mir noch ein paar gute Tutorials empfehlen? Ob Deutsch oder Englisch ist dabei egal.
Schauen kannst du mal nach »Einführung in JavaScript« von Shelley Powers, da steht ein bisschen drin. Wahrscheinlich musst du auf »JavaScript. The Definitive Guide« von David Flanagan zurückgreifen.
»AdvancED DOM Scripting« von Jeffrey Sambells und »Pro JavaScript Techniques« von John Resig setzen sich offenbar ausführlich mit dem Thema auseinander, da kann ich aber nur nach den Inhaltsverzeichnissen urteilen.Bei anderen Büchern findest du eher nix. »JavaScript und AJAX« von Christian Wenz sowie »JavaScript. Einstieg für Anspruchsvolle« von Ralph Steyer finde ich zum Thema dürftig. »ppk on JavaScript« von Peter-Paul Koch und »Beginning JavaScript with DOM Scripting and Ajax« von Christian Heilmann schweigen sich ebenfalls dazu aus.
Mathias
-
-
-
-
-
-