Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > de.comp.lang.javascript > #5333 > unrolled thread

js classe soll funktion mit callback aufrufen

Back to article view | Back to de.comp.lang.javascript

Contents

  js classe soll funktion mit callback aufrufen Jan Novak <repcom@gmail.com> - 2022-10-21 14:59 +0200
    Re: js classe soll funktion mit callback aufrufen Stefan Reuther <stefan.news@arcor.de> - 2022-10-21 19:04 +0200
      Re: js classe soll funktion mit callback aufrufen Jan Novak <repcom@gmail.com> - 2022-10-26 10:03 +0200
        Re: js classe soll funktion mit callback aufrufen Stefan Reuther <stefan.news@arcor.de> - 2022-10-26 19:22 +0200
          Re: js classe soll funktion mit callback aufrufen Jan Novak <repcom@gmail.com> - 2022-10-29 08:49 +0200
            Re: js classe soll funktion mit callback aufrufen Stefan Reuther <stefan.news@arcor.de> - 2022-10-29 15:40 +0200
              Re: js classe soll funktion mit callback aufrufen Jan Novak <repcom@gmail.com> - 2022-10-30 09:22 +0100

#5333 — js classe soll funktion mit callback aufrufen

Hallo,

meine Frage ist vermutlich sehr Laienhaft gestellt, aber ich bin ein JS 
Anfänger.

Ich habe eine JS Funktion wie diese:

function apicall(what, array, callback){
    jarray=encodeURIComponent(JSON.stringify(array));
    var url="pfunctions/api.php?key=[]key&do="+what+"&options="+jarray;
   $.ajax({
      url: url,
   }).done(function(raw) {
       var data = JSON.parse(raw);
       window[callback](data);
   });
}

Wenn ich in einer js Funktion dann zb.

apicall("getAllDatesTable",data,"meinCallback");

aufrufe, werden die Daten aus dem apicall wunderbar in die Funktion 
meinCallback übergeben. Soweit so gut.

Wie mache ich das aber aus einer Klasse? Also z.B.:

class autoimport {
   constructor() {
       console.log("Constructor: autoimport_dav");
   }

    run(){
     var fdata="irgendwas";
     apicall("getAllDatesTable",fdata,"this.meinCallback");
     // auch nicht als
     //apicall("getAllDatesTable",fdata,"meinCallback");
    }

    meinCallback(data){
	console.log(data);
    }
}

var a=new autoimport();
a.run();

Ich bekomme dann einen
Uncaught TypeError: callback is not a function
Error aus der apicall Funktion .

Jan

[toc] | [next] | [standalone]

#5335

Am 21.10.2022 um 14:59 schrieb Jan Novak:
> function apicall(what, array, callback){
> ...
>       window[callback](data);
...
> apicall("getAllDatesTable",data,"meinCallback");

Sowas macht man besser nur in Ausnahmefällen, wenn man als callback nur
einen String übergeben kann (das ist z.B. der Fall, wenn man ein
Formular-Ergebnis als jsonp erhalten muss, oder mit einem WebWorker
kommuniziert).

Besser ist, die Funktion direkt zu übergeben:

   function apicall(what, array, callback) {
   ...
      callback(data);
   ...
   apicall("getAllDatesTable", data, meinCallback);

Dann geht auch das...

>     apicall("getAllDatesTable",fdata,"this.meinCallback");

...relativ geradlinig:

      apicall("getAllDatesTable", fdata, this.meinCallback.bind(this));

oder, etwas ausführlicher
      /* aktuelles this festhalten, weil die anonyme Funktion
         ihr eigenes this sieht */
      var me = this;

      /* als callback eine anonyme Funktion übergeben, die an
         meinCallback weiterleitet */
      apicall("getAllDatesTable", fdata, function(data) {
          me.meinCallback(data);
      });



  Stefan

[toc] | [prev] | [next] | [standalone]

#5336

Am 21.10.22 um 19:04 schrieb Stefan Reuther:
> Dann geht auch das...
> 
>>      apicall("getAllDatesTable",fdata,"this.meinCallback");
> 
> ...relativ geradlinig:
> 
>        apicall("getAllDatesTable", fdata, this.meinCallback.bind(this));
> 

Danke, das funktioniert.
Wenn ich das richtig verstehe, übergebe ich die Funktion als Callback, 
welche innerhalb der Funktion im apicall ausgeführt wird. Das heisst, er 
springt gar nicht zurück, um die Funktion auszuführen, sondern bekommt 
den gesamten Inhalt der Funktion als Parameter mit?


Jan

[toc] | [prev] | [next] | [standalone]

#5340

Am 26.10.2022 um 10:03 schrieb Jan Novak:
> Am 21.10.22 um 19:04 schrieb Stefan Reuther:
>> Dann geht auch das...
>>
>>>      apicall("getAllDatesTable",fdata,"this.meinCallback");
>>
>> ...relativ geradlinig:
>>
>>        apicall("getAllDatesTable", fdata, this.meinCallback.bind(this));
>>
> 
> Danke, das funktioniert.
> Wenn ich das richtig verstehe, übergebe ich die Funktion als Callback,
> welche innerhalb der Funktion im apicall ausgeführt wird. Das heisst, er
> springt gar nicht zurück, um die Funktion auszuführen, sondern bekommt
> den gesamten Inhalt der Funktion als Parameter mit?

Das "zurückspringen" ist in beiden Varianten gleich: `$.ajax()`, und
damit `apicall()`, kehrt sofort zurück, speichert aber die Funktion
zwischen.

Eine Funktion ist auch nur ein Objekt. Es benimmt sich etwas anders als
andere Objekte - man kann es mit () aufrufen - aber das war's dann auch
schon. Genauso wie du Strings, (Referenzen auf) Arrays, Hashes,
DOM-Objekte usw. in Variablen speichern kannst, kannst du Funktionen in
Variablen speichern.

Du benutzt die `done`-Funktion und übergibst ihr eine anonyme Funktion.
Das ist genau das gleiche. `function(raw) {...` legt ein solches
Funktionsobjekt an, speichert es aber nicht erst unter einem Namen ab,
sondern gibt es direkt an `done` - genau wie `console.log(1+2)` das
Ergebnis der Addition nicht erst abspeichert, sondern direkt übergibt.


  Stefan

[toc] | [prev] | [next] | [standalone]

#5347

Am 26.10.22 um 19:22 schrieb Stefan Reuther:
> Das "zurückspringen" ist in beiden Varianten gleich: `$.ajax()`, und
> damit `apicall()`, kehrt sofort zurück, speichert aber die Funktion
> zwischen.
> 
> Eine Funktion ist auch nur ein Objekt. Es benimmt sich etwas anders als
> andere Objekte - man kann es mit () aufrufen - aber das war's dann auch
> schon. Genauso wie du Strings, (Referenzen auf) Arrays, Hashes,
> DOM-Objekte usw. in Variablen speichern kannst, kannst du Funktionen in
> Variablen speichern.
> 
> Du benutzt die `done`-Funktion und übergibst ihr eine anonyme Funktion.
> Das ist genau das gleiche. `function(raw) {...` legt ein solches
> Funktionsobjekt an, speichert es aber nicht erst unter einem Namen ab,
> sondern gibt es direkt an `done` - genau wie `console.log(1+2)` das
> Ergebnis der Addition nicht erst abspeichert, sondern direkt übergibt.


dann wird bei einem Callback eine "neue" Instanz aufgerufen?
Weil das funktioniert nicht ( >> andereFunktion() ):

   constructor() {
     this.addresses={};
     apicall("getAllAddresses", {}, this.getAllAddressesDone.bind(this));
   }

   getAllAddressesDone(data){
     this.addresses=data;
     console.log(this.addresses);
     //hier ist in der Var "this.addresses" alles drin
   }

   // wird z.B. von einem click aufgerufen
   andereFunktion(){
     console.log(this.addresses);
     //hier ist das "this.addresses" leer (aus dem constructor).
   }


Jan

[toc] | [prev] | [next] | [standalone]

#5348

Am 29.10.2022 um 08:49 schrieb Jan Novak:
> Am 26.10.22 um 19:22 schrieb Stefan Reuther:
>> Du benutzt die `done`-Funktion und übergibst ihr eine anonyme Funktion.
>> Das ist genau das gleiche. `function(raw) {...` legt ein solches
>> Funktionsobjekt an, speichert es aber nicht erst unter einem Namen ab,
>> sondern gibt es direkt an `done` - genau wie `console.log(1+2)` das
>> Ergebnis der Addition nicht erst abspeichert, sondern direkt übergibt.
> 
> dann wird bei einem Callback eine "neue" Instanz aufgerufen?

Nein, es wird keine neue Instanz des Objekts angelegt.

> Weil das funktioniert nicht ( >> andereFunktion() ):

Du zeigst nicht, wie du Instanzen anlegst.


  Stefan

[toc] | [prev] | [next] | [standalone]

#5349

Am 29.10.22 um 15:40 schrieb Stefan Reuther:

>> dann wird bei einem Callback eine "neue" Instanz aufgerufen?
> 
> Nein, es wird keine neue Instanz des Objekts angelegt.
> 
>> Weil das funktioniert nicht ( >> andereFunktion() ):
> 
> Du zeigst nicht, wie du Instanzen anlegst.

Ich dachte, das sei klar:

new meineKlasse();

oder ...

new meineKlasse().run(irgendwelcheDaten);

oder ...

var a = new meineKlasse();
a.run(irgendwelcheDaten);



Jan

[toc] | [prev] | [standalone]

Back to top | Article view | de.comp.lang.javascript

csiph-web