Finite state machines in JavaScript, Part 2, Implement a widget

Develop browser apps with JavaScript and finite state machines

From the developerWorks archives

Edward Pring

Date archived: January 4, 2017 | First published: February 13, 2007

Part 1 of this series illustrated how to use a finite state machine to methodically design complex behavior for a simple Web widget -- an animated tooltip that fades into and out of view. In this article, you learn to implement that behavior in JavaScript and take full advantage of its distinctive language features, including associative arrays and function closures. The resulting code is compact and concise, its logic is transparent, and its animation performs smoothly even on heavily loaded processors.

Part 3 will cover the practical issues of how to make the implementation work in all popular Web browsers.

This content is no longer being updated or maintained. The full article is provided "as is" in a PDF file. Given the rapid evolution of technology, some steps and illustrations may have changed.



static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Web development
ArticleID=195560
ArticleTitle=Finite state machines in JavaScript, Part 2: Implement a widget
publish-date=02132007