javascript - Typescript + Jquery Ajax + dette


Jeg holder på å overføre noe JavaScript-kode til TypeScript, og jeg har støtt på et problem.

Jeg har et AJAX-kall som sender et objekt som kontekst, dette objektet inneholder noen callbacks og litt annen informasjon som blir lest av suksess- eller feilkallbakene som indikerer hvor suksesskallet skal omdirigeres til:

function SomeAjaxService
{
    var self = this;

    self.CheckErrorType = function(...) {
        // Do something
    };

    var SuccessProxyCallback = function(results) {
        // Do some stuff with results, like send off some events
        this.successCallback(results);
    };

    var FailureProxyCallback = function(...) {
        // Do some stuff with errors, and fire some events
        var someErrorType = self.CheckErrorType(...);
        this.failureCallback(someErrorType);        
    };

    self.SendRequest = function(requestArgs) {
        var ajaxSettings = {
            context: requestArgs,
            // Assign a load of stuff
        };

        $.ajax(ajaxSettings);
    };
}

Nå, som du kan se, kaller feil-proxyen en lokal metode samt bruker "this"-kontekstobjektet. Så hvordan kan du håndtere denne typen scenario med TypeScript?

Kan du bare sette self=this i konstruktøren og fortsette som før?

== REDIGER ==

Som forespurt, her er en klasserepresentasjon av ovenstående som viser problemet med at dette må være to ting på grunn av den manglende self-variabelen.

class SomeAjaxService
{
    public CheckErrorType(someArg1: any, someArg2: any) {
        // Do some stuff with data
    };

    private SuccessProxyCallback(results: any) {
        // Do some stuff with results, like send off some events
        this.successCallback(results); 

        // Does the above *THIS* usage point to the context of the 
        // Ajax call or the actual instantiated class
    };

    private FailureProxyCallback(...) {
        // Do some stuff with errors, and fire some events
        var someErrorType = this.CheckErrorType(...);

        // The above *THIS* call cannot be correct if the context has overwritten
        // the scope of this, however I dont know if this is true, do I even need
        // this.CheckErrorType to invoke a local method?

        this.failureCallback(someErrorType);        

        // As mentioned above same issue here but the *THIS* should hopefully
        // point to the context object on the ajax object not the local instance.
    };

    public SendRequest(requestArgs: any) {
        var ajaxSettings : JqueryAjaxSettings = {
            context: requestArgs,
            // Assign a load of stuff
        };

        $.ajax(ajaxSettings);
    };
}

Som jeg sier ovenfor, er hovedproblemet at i en metode må jeg påkalle en av instansens metoder, samt påkalle en metode på kontekstobjektet fra ajax-kallet. Med ren javascript ville jeg hatt self=this, og da kan jeg omgå at this blir overskrevet, noe som er nødvendig for å holde ajax-asynkront tilstandsobjekt i omfang.

Svar #1

Kan du bare sette self=this i konstruktøren og fortsette som før?

Snakkende abstrakt, vil det å gjøre dette i konstruktøren vanligvis ikke løse noe (med mindre du fanger det senere i den metoden - se nedenfor). TypeScript-klasser lagrer klasseinstansdata på selve objektet i stedet for å fange lokale variabler. Fordi self vil bli lagret på this-objektet, ender du ikke opp med noe du ikke allerede hadde før.

Her er en måte å gjøre det på:

class SomeAjaxService
{
    private FailureProxyCallback(context, arg) {
        // now 'this' is the class instance and 'context' is requestArgs 
    }

    public SendRequest(requestArgs) {
        var self = this; // Note: captured local used in closure below
        var ajaxSettings = {
            context: requestArgs,
            // Do not use an arrow function here, even though it's tempting!
            error: function(arg) { self.FailureProxyCallback(this, arg) }
        };

        $.ajax(ajaxSettings);
    };
}

Relaterte artikler