Solution to "this" reference changing inside callbacks?

Question

Solution to "this" reference changing inside callbacks?

One of the issues I've been encountering again and again is the reference to the this pointer changing. Take the below example. I want to create a Server object, and store the resolution of the camera as a property. This is not possible, as this.resolution applies to a property in the camera callback object instead of the Server object.

function Server(options) {
    this.settings = options.settings;
    this.camera = options.camera;

    // Grab camera resolution
    this.camera.getImageResolution(function(err, data) {
        this.resolution = data;
    });
}

Server.prototype.start = function() {
    console.log(this.resolution); // This outputs an undefined variable error
}

In the past, I have worked around this by renaming this to self temporarily to call functions. This does not work when I am storing a value. I would need to to pass this into the callback, which I obviously cannot do.

Additionally, I cannot use apply, as that would not allow camera.getImageResolution to call its own methods.

What is the best route to take in solving this issue? Please ask for clarification if my question is vague.

javascript
node.js

Answer 1

function Server(options) {
    var self = this;

    self.settings = options.settings;
    self.camera = options.camera;

    // Grab camera resolution
    this.camera.getImageResolution(function(err, data) {
        self.resolution = data;
    });
}

Server.prototype.start = function () {
    return this.resolution;
}

var server = new Server({options: {...}, settings: {...}});
server.camera.getImageResolution();
// after getImageResolution's asynch method has completed
server.start()  // === data parameter from getImageResolution's asynch method callback