How do you bind a variable to a function in as3

Question

I have this code:

for each(var tool in tools){
tool.addEventListener(MouseEvent.MOUSE_DOWN, function(){
    trace(tool); //Always the last tool  
 });
}

How do I bind the value of tool to the function so that it's accessible on callback?

scriptocalypse · Accepted Answer · 2011-06-08T19:44:08.477

6

You have to use a function inside a function to properly bind the scope. It's kind of a hack in AS3. It's better not to go down that rabbit hole if you can help it. If you must, though...

for(var tool:Tool in _tools){
  var getHandler(scope:Tool):Function{
    var t:Tool = scope;
    return function(e:MouseEvent):void{trace(t)}
  }
  tool.addEventListener(MouseEvent.CLICK, getHandler(tool));
}

EDIT: And of course, any variables you need to work with in the handler should be passed into getHandler as well... so instead of just accepting the scope param, you'd also pass your id, count, current state, or whatever.

EDIT2: But ask yourself this question. How will you remove that event listener? That's the biggest reason I say to avoid this rabbit hole entirely. It's possible, but it's usually more trouble than using a more OOP way of solving this problem than lambda functions.

edited Jun 08 '11 at 19:44

answered Jun 08 '11 at 18:32

scriptocalypse

4,942
2
29
41

would this work if getHandler was defined, not as a 'nested' function, but out in my document class instead? – hoff2 Jun 08 '11 at 20:34
@Centipedefarmer Absolutely. In fact, I'd say that's better than the way I wrote it above. – scriptocalypse Jun 08 '11 at 20:35
1

I've been running into a lot of the removal issue's since starting to do it this way. I've been creating complete copies of the objects and resetting the variables. Not a good or clean solution but it works :/ – QuinnBaetz Jun 10 '11 at 04:16
@QuinnBaetz You pretty much just have to either store that lambda function in a variable on the tool object, or use a dictionary object where you store the tool as a key and the function as the value... There are a lot of really bad ways to do it, and a few less bad ones. I have a library I've written that handles this sort of thing in about the least bad way I can think of... rewriting the event dispatch system. ;) I've been debating releasing it to public. I'd feel bad if I ended up not having the time to maintain it as a real active project, though. – scriptocalypse Jun 10 '11 at 05:22

Urosan · Answer 2 · 2011-06-08T18:38:13.053

1

Try this.

for each(var tool in tools){
  tool.addEventListener(MouseEvent.MOUSE_DOWN, toolFunction )
}

function toolFunction (e:MouseEvent){
  trace(e.currentTarget)
}

Aftear reading question title again, i realized, that what u need is custom event or:

for each(var tool in tools){
      tool.addEventListener(MouseEvent.CLICK,
              function(e:MouseEvent){toolFunction (e, "another param")},
              false, 0, true);
    }

    function toolFunction (e:MouseEvent,anotherParam:String){
      trace(e.currentTarget)
      trace(anotherParam) //output "another param"
    }

edited Jun 08 '11 at 18:38

answered Jun 08 '11 at 18:00

Urosan

321
1
11

I need to bind other things in the future, not just things related to the mouseEvent – QuinnBaetz Jun 08 '11 at 18:22
Well with e.currentTarget you basicly don't do much with MouseEvent itself, but with target element(tool/s) in your case. That way u'll always get right tool element, not just last one. And if that tool is an object, u can assign whatever you like to it. – Urosan Jun 08 '11 at 18:30

score 0 · Answer 3 · answered Jun 08 '11 at 18:03

0

try to do:

for each(var tool in tools){
var t = tool;
t.addEventListener(MouseEvent.MOUSE_DOWN, function(){
    trace(t); //Always the last tool  
});
}

answered Jun 08 '11 at 18:03

Eugeny89

3,797
7
51
98

score 0 · Answer 4 · answered Jun 08 '11 at 19:33

You can't nest functions inside loops the parameters for the function call will have the same value across all iterations of the loop, and that value will be from the last most iteration. There are some hacks to handle this, but it is not good coding practice and makes it hard in the future to modify it.

What you need to do is more OOP style.

Since the Tool class is obviously custom you need to modify it to hold the values or whatever references you were talking about for the future.
Basically, if you have a value you need to pass along that is related to that object then just make that value an attribute of the class Tool.

No, it's definitely possible to early-bind the value of "tool" if you're tricky enough. It's all down to scope management. I agree that it would be better to do this in an OOP way, though. — scriptocalypse, Jun 08 '11 at 19:39

score 0 · Answer 5 · answered Jun 08 '11 at 19:51

0

use as3 signals

http://www.peterelst.com/blog/2010/01/22/as3-signals-the-best-thing-since-sliced-bread/

It can cater your problem nicely. Once I have tried signal I can't go back. It's much better than the event system in as3

answered Jun 08 '11 at 19:51

Unreality

4,111
11
48
67

1

You know, I'm not actually a big fan of Signals. It always seems like trading one problem (cumbersome listener gymnastics) for another (loss of compile-time type safety and poorly discoverable APIs that require access to the original source code). – scriptocalypse Jun 08 '11 at 20:10

How do you bind a variable to a function in as3

5 Answers5

Linked