Given the following object literal how do I call c from within b?

Update 1 - missed one thing I use JQuery load, which changes the context:

var a = {
    b: function (e) {

        $o.load(path, function (e) { // need to call c from here });
    },
    c: function (e) { 
    }
};

Given the following object literal how do I call c from within b?

Update 1 - missed one thing I use JQuery load, which changes the context:

var a = {
    b: function (e) {

        $o.load(path, function (e) { // need to call c from here });
    },
    c: function (e) { 
    }
};

• javascript
• jquery

Share Follow asked Oct 13, 2012 at 14:29 JsCoderJsCoder 2,23388 gold badges3535 silver badges6666 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 4

You should be able to do a.c() inside .b:

var a = {
    b: function(e) {
        a.c();
    },
    c: function(e) {}
};

a.b(); // calls c

Also, this will be bound to the a object which will allow you to access its properties using this.property:

b: function(e) {
    this.c();
},

Try this:-

var a = {
b: function(e) {
    a.c();
},
c: function(e) {}
};

a.b(); 

var a = {
    b: function (e) {
        a.c();
    },

    c: function (e) {
        // magic goes here
    }
};

a will be a closure so it's accessible in the functions (that is, a is defined in an wide, outer scope, which the narrower, inner scopes in each function inherit). Calling context is irrelevant; closures are formed when and where the functions are defined, so inside b, object a will always stay the same (unlike this, which can change).

From the method b you may call c using this.c as long as they are on the same object. However for the function expression being passed to $o I would suggest you bind the this pointer of b to it. Thus you do:

var a = {
    b: function (e) {
        $o.load(path, function (e) {
            this.c();
        }.bind(this));
    },
    c: function (e) {
    }
};

Edit: The way you're creating and using this object is fragile. The this pointer may point to anything, such as when you unbind the methods or call it with a different context. Even using a.c isn't foolproof as other code may change a and when the method b is called a will point to something else.

I would do something like this:

var a = function (a) {
    a.b = function (e) {
        $o.load(path, function (e) {
            a.c();
        });
    };

    a.c = function (e) {
    };

    return a;
}({});

This code can not be tampered with and allows you to create private variables and closures.

The easiest solution which requires the minimum changes is to use jQuery.proxy():

var a = {
    b: function (e) {

        $o.load(path, $.proxy(function (e) { this.c(); }, this));
    },
    c: function (e) { 
    }
};