Web DevCenter
oreilly.comSafari Books Online.Conferences.
MySQL Conference and Expo April 14-17, 2008, Santa Clara, CA

Sponsored Developer Resources

Web Columns
Adobe GoLive
Essential JavaScript

Web Topics
All Articles
Scripting Languages

Atom 1.0 Feed RSS 1.0 Feed RSS 2.0 Feed

Learning Lab

[ Siren ]

ActionScript for JavaScript Programmers

by Bruce A. Epstein, editor of ActionScript: The Definitive Guide

Maybe you've been asked to add a Macromedia Flash front-end to a client's Web site, and you need to learn Flash's ActionScript scripting language quickly. Or maybe you are evaluating whether to use Flash, and you need to know whether to embrace ActionScript or look down your nose at it. Flash is already the most ubiquitous browser plug-in in history. Disney's Web site as well as other major sites use Flash regularly, and it is only a matter of time until you'll need to know more about it.

I'm not here to defend the lousy UI design often perpetrated by Flash developers. I'm here to give you a leg up by leveraging your JavaScript knowledge in the ActionScript environment, so you can ensure that bad interfaces don't happen to good people. (If you are new to JavaScript, but have some ActionScript background, you'll find the discussion equally useful.)

First, we'll look at what ActionScript and JavaScript have in common. Then we'll talk about the environmental differences that dictate their usage. Lastly, we'll discuss the differences you must be aware of between the languages. Ironically, ActionScript for Flash 5 is much more closely related to JavaScript than to ActionScript for Flash 4, which used a completely different model. Colin Moock's ActionScript: The Definitive Guide pays special attention to backwards compatibility (see Appendix C) and the differences between ActionScript and JavaScript (see Appendix D).

Both Languages Derive from the ECMA-262 (ECMAScript) Standard

Related Reference

ActionScript: The Definitive GuideActionScript: The Definitive Guide
By Colin Moock
Table of Contents
Sample Chapter
Full Description
Read Online -- Safari

Both JavaScript and ActionScript are based on the ECMA-262 (ECMAScript) standard. Therefore, they share a nearly identical syntax, object model, and even many object classes. If you've read JavaScript: The Definitive Guide, you won't have much problem reading and writing ActionScript. For example, ActionScript implements the arguments object, which supports the callee and length properties, just like JavaScript. ActionScript also implements the Array, Boolean, Date, Math, Number, Object, and String classes familiar to JavaScript programmers.

Of course, ActionScript uses the same C-like operators and dot syntax as JavaScript. This sample function, which strips spaces from a string, should look familiar to JavaScript programmers:

function stripSpace (inString) {
   var outString = "";
   for (i = 0; i < inString.length; i++) {
     if inString.charAt(i) != "" {
       outString += inString.charAt(i);
   return outString

ActionScript uses the same datatypes as JavaScript, and it includes functions like isNaN() to test whether an expression equals the numeric constant NaN.

Environmental Differences: The Browser Versus the Flash Plug-in

Although JavaScript and ActionScript have much in common, neither exist in a vacuum. Client-side JavaScript operates within a browser, which has several important consequences. JavaScript makes heavy use of the Document and Window objects to access and control the browser environment. ActionScript doesn't support either of these objects because it doesn't use the same DOM (Document Object Model) as JavaScript. Likewise, ActionScript doesn't support a History object (which accesses the URLs that the browser has displayed).

I'm here to give you a leg up by leveraging your JavaScript knowledge in the ActionScript environment.

Because Flash .SWF files are assets within an HTML page, they don't have direct access to the HTML document or browser window information. ActionScript can access these indirectly by communicating with JavaScript. (Although ActionScript-to-JavaScript communication is limited to certain browser-and-platform combinations, ActionScript is generally more consistent across different browsers and platforms than various JavaScript incarnations.)

Of course, The Flash plug-in is a different environment from the browser itself. Movie clips are the atomic entity in Flash timelines. They can be manipulated and animated over time. Movie clips can appear on the main Flash timeline or be nested within other movie clips. Therefore, ActionScript programming makes heavy use of the MovieClip object class to control movie clips. Of course, movie clips have no direct parallel in JavaScript, but we've put the Movie Clip Chapter of ActionScript: The Definitive Guide online to explain it all.

The biggest difference you'll encounter in the two environments is learning where to put your code and understanding variable scope. Again, ActionScript: The Definitive Guide explains this in great detail, using a quiz application as an example.

Language Implementation Differences

We already talked about the differences between ActionScript and JavaScript due to the environments in which they are used. We've also said that ActionScript tends to be more consistent across browsers and platforms than JavaScript. That is because ActionScript is controlled by a single vendor, Macromedia, whereas each browser manufacturer implements its own variation of JavaScript. Note that ActionScript for Flash 5 doesn't correlate directly with any particular version of JavaScript, and that not all versions of JavaScript conform to the ECMA-262 standard. Nor do third-party imitations, such as the scripting language in Adobe's LiveMotion, offer complete compatibility with ActionScript.

Beyond the architectural dictates, ActionScript for Flash 5 sometimes departs from the ECMA-262 standard to maintain backward compatibility with Flash 4, or to minimize the Flash plug-in (a.k.a. Flash Player) size. For example, ActionScript doesn't support regular expressions, nor does it fully support the eval() function, which would require a run-time compiler.

Again, Appendix D of ActionScript: The Definitive Guide documents other differences between ActionScript and ECMA-262 and JavaScript. Most notably:

String-to-Boolean conversion
In ECMA-262, any nonempty string converts to true. ActionScript converts strings to true only if they evaluate to a nonzero number.

Case sensitivity
In ActionScript, keywords are case-sensitive but identifiers are not. This does not comply with ECMA-262, which demands complete case sensitivity.

Event handlers
ActionScript doesn't use event-handler names like onMouseOver(). Instead, it uses either onClipEvent (eventName) or on(eventName).

Undefined datatype conversion
ActionScript converts undefined to the empty string ("") in a string context or to 0 (zero) in a numeric context. ECMA-262 converts undefined to the string "undefined" in a string context or to NaN in a numeric context.

Switch statement
ActionScript does not support the switch (a.k.a. case) statement, which can be emulated using if-then statements.

Unicode support
ActionScript supports the Latin 1 and Shift-JIS character sets, but does not offer full Unicode support.

I hope that I've familiarized you enough with ActionScript to see that it is not a huge leap from JavaScript, or vice versa. Knowing the few but significant differences in the two languages' implementations will allow you to take advantage of your knowledge across both environments. A free trial version of Flash 5 is available on Macromedia's Web site.

Bruce A. Epstein is the author of Director in a Nutshell and Lingo in a Nutshell, the coauthor of Dreamweaver in a Nutshell and the editor of ActionScript: The Definitive Guide.

O'Reilly & Associates recently released (May 2001) ActionScript: The Definitive Guide.

Return to the Javascript and CSS DevCenter.