Preserve 'this' reference in javascript prototype event handler
event-handling, javascript, oop, this
Solution
I find `bind()` being the cleanest solution so far:
this.bar.onclick = this.ClickEvent.bind(this);
BTW the other `this` is called `that` by convention very often.
Problem
What is the correct way to preserve a `this` javascript reference in an event handler stored inside the object's prototype? I'd like to stay away from creating temp vars like '_this' or 'that' and I can't use a framework like jQuery. I saw a lot of people talk about using a 'bind' function but was unsure of how to implement it in my given scenario. ``` var Example = function(foo,bar){ this.foo = foo; this.bar = bar; }; Example.prototype.SetEvent = function(){ this.bar.onclick = this.ClickEvent; }; Example.prototype.ClickEvent = function(){ console.log(this.foo); // logs undefined because 'this' is really 'this.bar' }; ```