It’s Time to Can on() and onClipEvent() in Tutorials

I spend a pretty good deal of time reading other people’s tutorials, browsing flash blogs and forums and generally trying to find all the info about Actionscript development that I can. With the exception of the developers who stay on top of their game, and know the ins and outs of Actionscript, I’m seeing more and more people picking up and using old code, like on() and onClipEvent(). While neither event handler method has officially been deemed deprecated, both have served their time and been replaced by more standards compliant methods which also include additional functionality.

The majority of Flash and Actionscript tutorials indexed in the major tutorial indexes give me the impression they are either very old tutorials or they are written by people who don’t know Actionscript well enough to right the code in tutorial properly. This is a big pet peeve of mine. I want to actually teach people useful things about Actionscript, not just show them how to do something nifty that they’ll never have any hope of figuring out. Part of teaching someone to do something typically involves teaching them the right way to go about doing it.

On that note, these two methods might seem easier to begin with, because there are fewer letters to type, or you can place it right on the button or movie clip you want the code to effect, but in the end they are more confusing and cause problems for those trying to learn Actionscript. One of the biggest flaws is the inconsistency of what ‘this’ refers to. On a movie clip, ‘this’ refers to that movie clip, but when you use ‘this’ on a button, it refers to the timeline the button is sitting on – the equivalent of ‘this._parent’ to the movie clip. Try tracing ‘this’ on a button and on a movie clip and you’ll see the differing results.

The next major annoyance with these methods is the fact that they must appear on the button or movie clip element, not within it or in a global spot for your actions. This makes your code really hard to find and reference. Since using dot notation allows you to keep all of your code in a centralized location, it is the preferred way to add event handlers (which is what the on() and onClipEvent() methods do) to an object. Keeping your code together is an encouraged practice for many reasons, the simplest of which is because it will allow you to quickly edit code that you would otherwise have to search your file for. It just makes life easier in the long run. Trust me.

If you want to delete your onClipEvent(enterFrame) what are you going to do? Hmm. Not much. Want to delete your enterFrame event using dot notation, well that’s simple.

Dot notation ties the event handler directly to the object, just like a normal method or property, which is why it can be deleted and recreated.

My final reasoning for encouraging the use of dot notation’s way of event handling versus the on() and onClipEvent() ways is because it is closer to the new conventions of Actionscript 3. The general concept with Actionscript 3 is that you will tie a function to an event that is broadcast by an object. In other words, you tell your movie clip what function to call when it receives a certain action. Different syntax between Actionscript 2 and Actionscript 3, but the principle is exactly the same.

It could be said that on() and onClipEvent() use the same principle, but, in my opinion, it is different enough to make it confusing. With on() and onClipEvent(), you just give it a block of code to do when the event happens. Once the Actionscript is there, its there. That’s it, it’s not coming off. With dot notation, all of your code can be fluid and change at a moments notice to fulfill whatever function you need it to perform.

For some examples using dot notation, take a look at the Advanced Five Stat Button tutorial. The code in that tutorial is placed inside the movie clip, rather than in a global spot because the idea was to create a template for the button, and it is a bit of a pain to have to move the global code along with your button all of the time. The Actionscript can easily be moved to a global spot by giving the movie clip an instance name and using dot notation to refer to it.