Home >
While we wait for the next version of Flex Builder, which will contain a code formatter, I'd like to point out a few practical reasons why orderliness is important.
(Psst... want to add your $0.02 to the new version? Adobe wants to hear from you!)
Can you spot the bug? This custom component is not as wide as expected:
<mx:TextArea width="100" height="100%"
contextMenu="{cm}" xmlns:components="components.*"
creationComplete="init()" width="100%"
xmlns:mx="http://www.adobe.com/2006/mxml">
...
</mx:TextArea>
The bug occurs because two width attributes were provided, one with the value 100 pixels and one with the value 100%. Jamming a long list of attributes into an MXML tag in no particular order is an invitation to chaos. No error message is generated if an attribute is specified twice.
I adopt the convention of ordering all attributes in alphabetical order, one per line; I would write the above like this:
<mx:TextArea
contextMenu="{cm}"
creationComplete="init()"
height="100%"
width="100%"
xmlns:components="components.*"
xmlns:mx="http://www.adobe.com/2006/mxml">
...
</mx:TextArea>
Other people write certain attributes first, like id, width and height. Whatever convention you adopt, stick to it.
Here are the official ActionScript coding conventions, as published by Adobe. I take some of it the way the cast of "Pirates of the Caribbean" consider the Pirate's Code: "Argh, it be more like a set of guidelines."
ANSI/Unix vs. Vertically Compressed Styles
I realize that this topic might make me flame-bait, but my experience has shown that the ANSI/Unix style of vertically spacing parenthesis increases the maintenance costs of a program. Functions/methods should fit on a single screen; so should data structures. Because programs written in bygone days had to be editable on a green screen, 80 columns was the widest that a program could be written. In the 'bad old days', it was better to let a program run to more lines in order to avoid folding code. Here is an example:
private function GridContextEventHandler(event:GridContextEvent):void
{
if (event.menuItem=='Edit')
{
EditGridItem(event.selectedIndex);
}
else if (event.menuItem=='Remove')
{
RemoveGridItem(event.selectedIndex);
}
}
A vertically compressed style is much more easily read. Python initially made waves in part because code formatting enforces control structure. Python programs do not need parentheses as a result. Why not write ActionScript in the same manner, so parenthesis are virtually redundant? The Sun/Java convention is a good example of this formatting convention. The above program fragment would be written like this using a vertically compressed style:
private function GridContextEventHandler(event:GridContextEvent):void {
if (event.menuItem=='Edit') {
EditGridItem(event.selectedIndex);
} else if (event.menuItem=='Remove') {
RemoveGridItem(event.selectedIndex);
}
}Complete Disregard for Style
Recently I examined a programming candidate's programming style. He didn't get the job. Here is how he wrote the above code:
private function GridContextEventHandler(event:GridContextEvent):void{
if(event.menuItem=='Edit')
EditGridItem(event.selectedIndex);
else if(event.menuItem=='Remove')
RemoveGridItem(event.selectedIndex);
}The rest of his code did not work very well. Seems like from the way he wrote it that he didn't really care. No surprise that someone else got the job.
Comments
3 Comments
Leave a comment
Tag Cloud
New Recommended eBooks
Get free updates and all-access to O'Reilly eBooks on your iPhone, Kindle, Sony Reader, or other mobile device.
Learn more about eBook bundles
News & Events
Books Excerpts
Read excerpts of RIA books provided by InsideRIA and O'Reilly Digital Media.
Find more book excerpts
Flame bait indeed! Ha! One of my biggest complaints with vertically compressed style is that, in my experience, most developers that use this style tend to use very little white space overall. White space, just as in the design world, is a key element in making something feel organized and easily approachable. For me, using the ANSI/Unix style forces me into putting a space between the function declaration and its contained code. Sure there's a curly brace in that space, but my eyes have learned to love seeing it there as I think it helps me see indentations better, thus making it easier for me to scan a large block of code. But again, thats just me and my personal tendencies. Its different for everyone.
When writing CSS I set the properties in alphabetical order as well. I do this to avoid duplication as you state plus I find it easier to locate the property I wish to change at a later date. This is especially helpful on a class that has a serious amount of properties in a huge block of code.
I've always preferred the vertically compressed style but I still see the ansi style at times. Lee Brimelow uses the ansi style in his Flash tutorials and personally I don't see what the big deal is. Just because the vertically compressed style is more readable to you doesn't make it so for everyone else.
As for your candidate, I think you were a little harsh. So his coding style didn't follow the standards you set that he may have been unaware of. Did you ask him why his coding style was like that? Maybe he learned that way. Maybe he transitioned from another language where that was the preferred style. You mention the rest of his code didn't work very well. Did it work at all? Because if his code failed to function properly then that's the reason to skip him, not his coding style. Coding style can be adjusted, bad code is something altogether different.
I appreciate your article and not just because my coding style matches yours. Because writing something to put it out there for people to read and critique is not easy thing to do. But articles like this always bother me because they come off as having the attitude that if you don't do things my way then what you do is wrong. Much like the people who always point out in comments that "this page doesn't validate" and all I can say is, who cares? If the end result meets expectations then who cares? There is a point with mentioning maintenance and other coders following in your footsteps but that's again assuming everyone else does things your way.
This is much like what was happening in the Flash community when AS3 became available. Too many people were insisting that from then on if you didn't code Actionscript in packages and classes then you were doing it wrong. And that's just a silly notion to have.
I glanced through the classes that come with Flash CS3 and guess what? They were clearly written by different people on the same team (or possibly on other teams) because some of them follow the ansi style and others follow the vertically compressed style. And yet it still all comes together in the end and works as expected.
All in all, it really is true that different people are in fact different. So as long as a programming language allows for more than one coding style then there will always be more than one coding style. To attempt to change that takes energy away from more useful and important topics.
By the way, this page doesn't validate.
Hi,
Interesting article. I also tried to stick to the flex sdk coding conventions, but hate the fact they aren't using vertically compressed styles, and honestly I don't see why, adding a line for each " { " and " } " can really add loads of lines to your code and looks really bad imo especially in if/else statement blocks,
For attributes, I also thought putting them alphabetically would be a nice solution but it doesnt sound logic at all, i group namespaces, properties, styles and event listeners in no particular order, otherwise coding becomes too hard, but like travis mentionned this isn't really a big deal, people will always code like they thing it's best for them, so much for conventions :)