Writing better OO with ATLAS – part I
ATLAS makes writing OO Javascript a lot easier than it used to be. It’s fair to say that Javascript has supported OO for some time now; however, we’re talking about limited support only which is based on the use of the prototype property. In practice, this means that we can use inheritance, but in a very limited way. With ATLAS, we have access to
This may not seem much, but when compared to what Javascript offers by default, it’s really a lot. Enough talk, it’s time to see some examples on what we can do with ATLAS. Let’s start by the basics: adding the client ATLAS files. This might be done in two ways: you can use the ScriptManager control or you can add the files by hand. Adding the files through the ScriptManager control is easy and you get automatic browse detection. However, it’s not something you can do if you’re not using an ASP.NET page. Since this post is about the client approach, I’ll just use a script element to drop the necessary files on my page:
<script type="text/javascript" src="Atlas.js">
</script>
Now we can proceed and start talking about important things. Let’s start with namespaces.
Namespaces diminish type collision. When we’re writing Javascript OO code, we should always start by creating a new namespace which will host our types. This can be achieved through the registerNamespace method:
Type.registerNamespace( “LA” );
Namespaces are objects that are added as properties to the object window. Nested namespaces are also represented by objects; however, they’re added as a property to the parent namespace (instead of being added directly to the window object). So, if you write something like this:
Type.registerNamespace( “LA.Controls” )
It’ll result in the addition of a new property of type Object (LA) to the window Object. On the other hand, this new LA object will also have a new property attached to it (you guessed it: Controls, of type Object).
Back to the important stuff: classes. Namespaces are only useful because they’ll be used as a container for several types. Most of the time, you’ll find yourself creating new classes. The following example shows how to create a new class called Student, with two fields (exposed by what we can call properties – though they’re really methods):
Type.registerNamespace( "LA" );
LA.Student = function( age, name ){
var _name = name;
var _age = age;
this.get_name = function(){ return _name; }
this.set_name = function( value ){ _name = value; }
this.get_age = function(){ return _age; }
this.set_age = function( value ){ _age = value; }
}
LA.Student.registerClass( "LA.Student" );
As you might expect, classes in “ATLAS Javascript” still rely heavily in the use of functions. Internally, the previous class has two fields which aren’t available to the “outside world”. That’s why it was necessary to add those methods to retrieve and/or change the values of those fields (I normally call this methods properties). After creating the class, it’s really important to register it (as we’ll see in a future post).
Creating a new instance of the class can be achieved by using the new operator:
var std = new LA.Student( 30, "Luis" );
alert( std.get_name() + " - " + std.get_age() );
If you’re as curious as me, then you’re probably wondering why we must call the registerClass method. That will be explained in the next post .