js classe soll funktion mit callback aufrufen

[Jan Novak]

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

[Stefan Reuther]

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

[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?


Jan

[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.


Stefan

[Jan Novak]

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

[Stefan Reuther]

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

[Jan Novak]

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