Scope (closure?) question

Discussion in 'Javascript' started by Kidogg, May 25, 2007.

  1. Kidogg

    Kidogg Guest

    Hi all,
    First let me apologize for being an idiot when it comes to Javascript,
    I've only recently had to do any serious work in it - and I'm properly
    stuck already!

    Essentially I'm trying to bind a click event (using MooTools) to a
    <div>, but inside the event handler have access to an object (of my
    own creation) that "owns" the <div>. So essentially something like the
    following (syntax is probably wrong - I'm away from my dev machine):

    function MyObject(objid,parent)
    {
    this.parent = $(parent);
    this.divhandle = new Element('div');
    this.divhandle.injectInside(this.parent);
    this.objid = objid;

    this.divhandle.addEvent('click', this._handleClick);
    }

    MyObject.prototype._handleclick = function(ev)
    {
    var e = new Event(e);

    // how can i get a reference to the "MyObject" instance here?
    // this.? doesnt seem to be valid & e.target just references the
    <div>
    }

    Any help / comments appreciated,

    Thanks,
    Kieran
     
    Kidogg, May 25, 2007
    #1
    1. Advertising

  2. Kidogg

    RobG Guest

    On May 25, 9:03 am, Kidogg <> wrote:
    > Hi all,
    > First let me apologize for being an idiot when it comes to Javascript,
    > I've only recently had to do any serious work in it - and I'm properly
    > stuck already!
    >
    > Essentially I'm trying to bind a click event (using MooTools) to a


    This is a general javascript news group, not a MooTools group. I'd
    suggest you start with the MooTools forum:

    <URL: http://forum.mootools.net/ >


    > <div>, but inside the event handler have access to an object (of my
    > own creation) that "owns" the <div>. So essentially something like the
    > following (syntax is probably wrong - I'm away from my dev machine):
    >
    > function MyObject(objid,parent)
    > {
    > this.parent = $(parent);
    > this.divhandle = new Element('div');
    > this.divhandle.injectInside(this.parent);
    > this.objid = objid;
    >
    > this.divhandle.addEvent('click', this._handleClick);
    >
    > }
    >
    > MyObject.prototype._handleclick = function(ev)
    > {
    > var e = new Event(e);
    >
    > // how can i get a reference to the "MyObject" instance here?
    > // this.? doesnt seem to be valid & e.target just references the
    > <div>


    Without knowing how _handleclick is called, it's impossible to say.
    The value of a function's this keyword is set by the calling function,
    not by the declaration. Presumably somewhere you are doing:

    var anObj = new MyObject(...);

    If _handleclick is called as a method of anObj, then its this will
    refer to anObj. However, if it is called some other way, it likely
    will not.

    It seems that you are attaching _handleClick to the DOM object, so it
    is very likely that its this keyword is a reference to that (though I
    have no idea how MooTool's addEvent function works, other libraries
    use call or apply to ensure it does).


    --
    Rob
     
    RobG, May 25, 2007
    #2
    1. Advertising

  3. Kidogg

    Kieran Guest

    On May 25, 3:19 am, RobG <> wrote:
    > On May 25, 9:03 am, Kidogg <> wrote:
    >
    > > Hi all,
    > > First let me apologize for being an idiot when it comes to Javascript,
    > > I've only recently had to do any serious work in it - and I'm properly
    > > stuck already!

    >
    > > Essentially I'm trying to bind a click event (using MooTools) to a

    >
    > This is a general javascript news group, not a MooTools group. I'd
    > suggest you start with the MooTools forum:
    >
    > <URL:http://forum.mootools.net/>
    >
    >
    >
    > > <div>, but inside the event handler have access to an object (of my
    > > own creation) that "owns" the <div>. So essentially something like the
    > > following (syntax is probably wrong - I'm away from my dev machine):

    >
    > > function MyObject(objid,parent)
    > > {
    > > this.parent = $(parent);
    > > this.divhandle = new Element('div');
    > > this.divhandle.injectInside(this.parent);
    > > this.objid = objid;

    >
    > > this.divhandle.addEvent('click', this._handleClick);

    >
    > > }

    >
    > > MyObject.prototype._handleclick = function(ev)
    > > {
    > > var e = new Event(e);

    >
    > > // how can i get a reference to the "MyObject" instance here?
    > > // this.? doesnt seem to be valid & e.target just references the
    > > <div>

    >
    > Without knowing how _handleclick is called, it's impossible to say.
    > The value of a function's this keyword is set by the calling function,
    > not by the declaration. Presumably somewhere you are doing:
    >
    > var anObj = new MyObject(...);
    >
    > If _handleclick is called as a method of anObj, then its this will
    > refer to anObj. However, if it is called some other way, it likely
    > will not.
    >
    > It seems that you are attaching _handleClick to the DOM object, so it
    > is very likely that its this keyword is a reference to that (though I
    > have no idea how MooTool's addEvent function works, other libraries
    > use call or apply to ensure it does).
    >
    > --
    > Rob


    Sorry, I thought that I was asking a generalistic JavaScript question!
    >From your pointer to the "call" function I managed to come up with

    something similar to this:

    function MyObject(objid,parent)
    {
    this.parent = $(parent);
    this.divhandle = new Element('div');
    this.divhandle.injectInside(this.parent);
    this.objid = objid;

    this.divhandle.addEvent('click',
    this._handleClick.bindWithEvent(this));
    }

    MyObject.prototype._handleclick = function(ev)
    {
    var e = new Event(e);
    alert(this.objid);
    }

    So thanks very much for your help in that regard!

    --
    Kieran
     
    Kieran, May 27, 2007
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Steven W. Orr

    Another dumb scope question for a closure.

    Steven W. Orr, Jan 9, 2008, in forum: Python
    Replies:
    2
    Views:
    248
    Waldemar Osuch
    Jan 9, 2008
  2. grocery_stocker
    Replies:
    5
    Views:
    115
    Robert Dober
    Aug 31, 2007
  3. Julian Mehnle
    Replies:
    0
    Views:
    261
    Julian Mehnle
    Jul 17, 2003
  4. Andrey Fedorov
    Replies:
    2
    Views:
    104
    Andrey Fedorov
    Oct 27, 2008
  5. codethief

    Closure scope confusion

    codethief, Mar 19, 2010, in forum: Javascript
    Replies:
    14
    Views:
    220
    Thomas Allen
    Mar 19, 2010
Loading...

Share This Page