All Things Patrick - Working Hard to be Lazy!

Craig Fowler stumped me today until he provided a further sampling of his code. Shortly thereafter I realized what the issue was as I've run into the same issue in the past (& hopefully this page will prevent me being stumped in the future).

The code he initially presented me with was

<a onclick="obj1.doSomething();"> ...

and he stated he was having issues with using this.someMethod(); inside of obj1... i.e.

var obj1 = new function() {
    this.name = 'Object 1';
 
    this.doSomething = function() {
        this.someMethod(
            'Hello, my name is ' + this.name
        );
    };
 
    this.someMethod = function( text ) {
        alert( text );
    }
};


Granted, you really wouldn't write code this bad, but we're just whipping up a quick example to test the problem.
well, putting <a href="#" onclick="obj1.doSomething();"> works just fine... At which point Craig mentioned that that was the end result he was wanting... what he was using to attach it was this snippet from a function -

if(eventElement.addEventListener) {     eventElement.addEventListener("click",       subscribers[currentSubscription].shout, false) } else if(eventElement.attachEvent) {     eventElement.attachEvent("onclick",       subscribers[currentSubscription].shout) }

I had to laugh as soon as I saw it because I remembered doing the same thing. Javascript variables are not really variables... what you create with var a = 1 + 1; is a reference to a protected variable inside the Javascript engine. There are alot of detailed discussions about this elsewhere so I won't go that route.

Initially looking at the code you may think that the function you're giving to addEventListener/attachEvent is going to be the code that goes inside the onclick event... i.e.

element.onclick = function() {     passedFunction(); }

But in reality what is happening is this -

element.onclick = passedFunction;

I don't know of any good solutions. The solution I had come up with before was to write a proxy function. Craig did the same thing in writing a proxy method into the parent class. A proxy function would be something like the following -

function proxyFunction( evt ) {     evt = evt || window.event;     ...code to determine what function *really* needs to be called...     if ( realFunction ) {         realFunction();     } }