Constructor variables in prototype model not accessible after ajax call

Question

I cannot access the constructor of a class when I return from an asynchronous call using a callback.

In this case I cannot access the test variable defined in the Myclass1 constructor

I can't find a solution for this, what am I doing wrong ?

var MyClass1 = function () {

    this.test = 5;
};
MyClass1.prototype = function () {
    //This is the function which calls another Myclass2 which contains the function for ajax //request
    test = function () {
        myClass2 = new MyClass2();
        myClass2.getRequest.call(this, callback);
    },
    //This is the call Back
    callback = function () {
        alert(this.test); /*<---Cannot access this,shows undefined.In firebug it show this.test is not defined*/
    };

    return {
        test: test,
        callback: callback
    }
}

MyClass2.prototype = function () {
    getRequest = function () {
        //make an async call set the success to the callback .I have propagated the data to //myclass1
        $.ajax({
            url: "test.html",
            success: callBack.call(this, data) //<--I call the callback using myClass1
        })
    }

    return {
        getRequest: getRequest;
    }
}

Answer 1

Ok, so there are many points:

First

On the prototype creation, please, declare variables. Right now you are creating "test", "callback", and "getRequest" global variables because you dont use "var"

MyClass1.prototype = function () {
    var test = function () {
        // some code...
    };

    var callback = function () {
        // some code...
    };

    // And more code...
};

And the comma at the end of "test" declaration works because of it's a operator, but I'm pretty sure it does not what you mean to do.

Or you can directly create functions:

MyClass1.prototype = function () {
    function test() {
        // some code...
    }

    function callback() {
        // some code...
    }

    // And more code...
};

Second

You are assigning "prototype" property to a function

MyClass1.prototype = function() { ... };

This means the prototype of your class is a function, who has methods "call", "apply", "bind" but not "test" nor "callback". Probably you wanted to create a Immediately-Invoked Function Expression (IIFE)

MyClass1.prototype = (function() {
    function methodA() {
        // some code...
    }

    return {
        methodA: methodA
    };
})();

Or a simple object:

MyClass1.prototype = {
    methodA: function() {
        // some code...
    },
    methodB: function() {
        // some code...
    }
};

Third

I don't understand what is your code doing, where is "MyClass2" defined, it extends "MyClass1"?

Fourth

You are assigning the "test" property on MyClass1's prototype to a function, but then, on the constructor you assign the "test" property to a number, maybe you wanted to use different properties.

Fifth

On this line:

success: callBack.call(this, data)

You are invoking function "callback" (I don't know where it does come from), I repeat, you are invoking it, not setting it as a callback, you're just calling the function and telling $.ajax than the callback will be the value returned by "callback.call(this, data)", probably "undefined".

If you wanted to set "callback" function as callback for the ajax petition you need to pass a function and inside of this function you do whatever you want to do when the array arrives, in this case invoke "callback", but you must save "this" variable in order to use it:

var self = this;
$.ajax({
    url: "test.html",
    success: function(data) {
        callBack.call(self, data);
    }
})

I suppose data variable comes from the ajax petition...

As you see is really difficult to give a accurate response when the code is not tested so the next time please, provide a fiddle with your code.

If all my assumptions are right: this is a code like the one you need: http://jsfiddle.net/pw3hj/