Question

I’ve got a simple question about accessing variables in jQuery. Is there are way to access the variable (wrap) when I call the read function on click of ‘a’.

(function() {
    var Example= {
        init: function() {
            var wrap = 'hello world';
            $('a').on('click', this.read);
        },

        read: function() {
            console.log(wrap)
        }
    };

    Example.init();
})();

Answer 1

There are a few ways to accomplish this. Perhaps the easiest is to change the scope of the ‘wrap’ variable. Currently, since it’s declared with a var inside the init function, it’s scoped to the init function and not available outside of init directly. So, you can declare the ‘wrap’ outside the init (it could be a property of the ‘Example’ object):

    var Example= {
        wrap: 'hello world',
        init: function() {
            var self = this;
            $('a').click(function(){
                self.read();
            });
        },

        read: function() {
            console.log(this.wrap);
        }
    };

    ​Exa​mple.init();

This makes ‘wrap’ scoped to ‘Example’ and available as a property of ‘Example’ throughout any function defined within ‘Example’.

(Edit: had to tweak this a bit to properly handle the closure.)