CODEWITHSUNDEEP
javascriptjquery
dvlpr
dvlpr

Reputation: 122

Scope issue inside objects that are inside objects

I've come across a problem while trying to build a simple jQuery plugin, having to do with scopes I guess.

The problem in short: A class (A) creates an object (B), in which a property (C) is set to one of the class methods (D). How can I access class A's methods not contained inside the object (B) through the property ( C)?

Longer version (code below): I'm declaring an object (lets call it publicMethods) inside the plugin, comprised of a bunch of methods. These methods should be some default methods (declared inside the plugin), or user declared ones if the user has declared her own when initializing the plugin.

The idea is that when the user defines her own custom method, there should be some functions and variables accessible to her (like this.someVar) in that function.

This creates some limitations though.

I want the default methods to have access to some internal functions and variables, not contained inside the object publicMethods. But when I access these methods through the object they are inside, instead of calling them directly, I do not have access to another variables/functions not inside that object.

I'm trying to find a way to let the default methods have access to it's class siblings. I know I can do some conditional statements before calling the method (if it is user defined or not), or even declare a global variable pointing to "this", but I'd rather keep it clean.

var Plugin = function (opt) {
    this.settings = $.extend({
        "someVar"   : "Value",
        "someFunc"  : null
    });

    this.anotherVar = "Hello World";
    this.setPublic();
    this.run();
}

Plugin.prototype = {
    setPublic: function() {
        this.publicMethods.someFunc = this.someFunc;
        if ($.isFunction(this.settings.someFunc)) {
            this.publicMethods.someFunc = this.settings.someFunc;
        } else {
            this.publicMethods.someFunc = this.someFunc;
        }
    },
    someFunc: function(arg) {
        return this.anotherVar; // returns type error the second time
    },
    run: function () {
        this.someFunc();
        this.publicMethods.someFunc();
    }
}

Upvotes: 0

Views: 25

Answers (1)

Siguza
Siguza

Reputation: 23850

From MDN: Function.prototype.bind():

The bind() method creates a new function that, when called, has its this keyword set to the provided value, [...].

So the following should work:

setPublic: function() {
    this.publicMethods.someFunc = this.someFunc.bind(this);
    if ($.isFunction(this.settings.someFunc)) {
        this.publicMethods.someFunc = this.settings.someFunc.bind(this);
    }
    // This is redundant anyway:
    /* else {
        this.publicMethods.someFunc = this.someFunc.bind(this);
    }*/
},

Upvotes: 1

Related Questions