OO Concepts for JavaScript Developers

Parent Previous Next

This section is primarily geared towards those of our customers who are moving from our other technologies (Flex, Android, or iOS) to the JavaScript version of our product. If you are only using our HTML product, this section may not be of too much value to you, but it should be an interesting read nevertheless.


As most of you are already aware, JavaScript does not have first class OO support that ActionScript does. However, it does have an extremely versatile prototype based architecture that can be used to mimic most OO concepts. Indeed, there are numerous implementations of OO concepts in JavaScript. The goal of this section is not to go over the various mechanisms that let you emulate OO programming in JavaScript. There are numerous resources on the web that do this. Rather, in this section we will visit a few important concepts that you need to be aware of when you program against the HTMLTreeGrid API, mostly in scenarios where you need to write custom itemRenderers, itemEditors, or you are extending the core classes from the framework.


When implementing HTMLTreeGrid, we have created a small OO implementation that closely mimics ActionScript. In this section, we will cover two main concepts.


  1. The Flexicious Typed Object class (flexiciousNmsp.TypedObject) : This object is the base class of all classes in the HTMLTreeGrid library. This class provides basic OO support, including Class Names, Interfaces, Type checking or interface implementations via the “implementsOrExtends” function (equivalent to “is” keyword from ActionScript), and other OO constructs like prototype chaining and polymorphism.        
  2. The Flexicious UIComponent class (flexiciousNmsp.UIComponent) : This class, inherits from flexiciousNmsp.TypedObject and is primarily responsible for encapsulating a HTML domElement, manipulating it in an API that is compatible with a number of Flash based API calls. In other words, we ported a limited sub section of the Flex SDK’s UIComponent and DisplayObject class so we could implement Event Dispatching, Validation/Invalidation, Sizing and positioning similar to the analogous counterparts from Flex, so our HTMLTreeGrid code could be ported with ease. This should assist you as you port over your itemRenderers, editors, class factories and more. The other key aspect of this class is that it extends the flexiciousNmsp.EventDispatcher class. This affords it the ability to broadcast and listen for events.


First, lets take a quick look at the flexiciousNmsp.TypedObject class.