Javascript面向对象-结果变得不确定

Question

Im making use of object-oriented capabilities of javascript program language. I have created my class LocationClass as follows:

 function LocationClass(id, color, uri) {

        this.id = id;
        this.uri = uri;
        this.color = color;
        this.locations = "";
        this.Group = L.layerGroup();
        this.icon = L.MakiMarkers.icon({
            color : this.color,
            size : "l"
        });
        this.Cluster = L.markerClusterGroup();

        this.markersimple = function() {
            console.log(this.color);


            var options = {
                onSuccess : loadMarkersSuccess,
                onFailure : loadMarkersFailure,
            };

            WL.Client.invokeProcedure({
                adapter : 'Clases',
                procedure : 'getRecursos',
                parameters : [ this.uri ]
            }, options);

        };
     this.loadMarkersSuccess = function(response) {

        this.locations = response.invocationResult.results.bindings;
        console.log(this.color);
     };

     this.loadMarkersFailure = function(response) {
        alert("No se ha podido obtener la información. Revisa tu conexión.");
     }; 
    }

I'm calling the markersimple function as follows:

var locationclass = new LocationClass(this.id,color,vector[this.id].class.value);
locationarray.push(locationclass);

for (var i = 0; i < locationarray.length; i++) {


        locationarray[i].markersimple();


    }

The problem is that there is no object-context defined When I try to access the locationclass object within the onsuccess function. For instance, if I check the value of color, the app returns "undefined" value. It's the same if I try to access any function within that object.

Any help is welcomed.

Answer 1

You can either use bind to bind an object as the this value.

var options = {
    onSuccess : this.loadMarkersSuccess.bind(this),
    onFailure : this.loadMarkersFailure.bind(this),
};

Or you can use closures (from within constructor):

var that = this;

...

this.loadMarkersSuccess = function(response) {

    that.locations = response.invocationResult.results.bindings;
    console.log(that.color);
};

By the way, functions should usually be attached to the constructor's prototype .