Section 8.2. Client-Side Versions of .NET Classes

8.2. Client-Side Versions of .NET Classes

In addition to adding OOP-like features for JavaScript coding, Atlas implements client classes that are analogs of some .NET classes. By doing this, two goals are achieved:

Functionality missing in JavaScript is provided as part of Atlas.
.NET developers with little JavaScript experience can use some familiar elements in their code.

In my opinion, this is one of the areas where upcoming Atlas versions will most certainly add more features, so the following list of classes is neither exhaustive nor final. Two useful features that are already available are Sys.StringBuilder and enumerations.

8.2.1. Sys.StringBuilder

One of the new features introduced in .NET 1.0 that really paid off in terms of performance was the introduction of the StringBuilder class. The problem is that applications are usually full of code like this:

 string s = "", t; while () {   t = <value>;   s += t; }

The problem lies in s += t, which is equivalent s = s + t. Whenever this code is executed, a copy of s and a copy of t is created in memory, then concatenated, and finally saved back into s. However copying s could be unnecessary. StringBuilder uses an optimized algorithm for string concatenation.

In JavaScript, this approach does not have any measurable effect on memory (in fact, the implementation seems to be a tick slower than the standard approach). On the other hand, performance is not as large of an issue for client script as it is for server code. Nevertheless, for consistency with your server coding techniques, you can rely on your .NET coding techniques and use StringBuilder on the client-side. Example 8-7 puts the StringBuilder class to work. It concatenates some strings to build an HTML chessboard.

Example 8-7. Using an Atlas StringBuilder

 ClientStringBuilder.aspx <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head  runat="server">   <title>Atlas</title>   <script language="Javascript" type="text/javascript">   window.onload = function() {     var sb = new Sys.StringBuilder();     for (var i = 8; i >= 1; i--) {       for (var j = 97; j <= 104; j++) {         sb.append(String.fromCharCode(j));         sb.append(i);         sb.append(" ");       }       sb.appendLine();       sb.appendLine();     }     document.getElementById("output").innerHTML = "<pre>" + sb.toString() + " </pre>";   }   </script> </head> <body>   <form  runat="server">     <atlas:ScriptManager  runat="server" EnableScriptComponents="false">     </atlas:ScriptManager>     <div ></div>   </form> </body> </html>

The built-in JavaScript function String.fromCharCode() converts an ASCII code to its associated character, so the inner for loop runs from "a" tHRough "h". As Figure 8-4 reveals, the code in Example 8-7 creates a simple chessboard.

Figure 8-4. A chessboard (with some potential)

8.2.2. Enumerations

Another .NET type that is emulated by Atlas for JavaScript is the Enum type. This is implemented by the Atlas Web.Enum class. Unfortunately, it is impossible to use the JavaScript for...in syntax to iterate through a Web.Enum enumeration. A workaround is to create a custom enumeration using the Type.createEnum() method.

As parameters, you first provide the name of the enumeration and then all values and indexes, in the following fashion:

 Type.createEnum(   "ORA.MyEnums.Ajax",   "Asynchronous", 0,   "JavaScript", 1,   "and", 2,   "XML", 3);

The getValues() method of the enumeration then returns all values of the enumeration (which are internally stored as an array), as shown in Example 8-8.

Example 8-8. Using an Atlas Enum

 ClientEnum.aspx <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head  runat="server">   <title>Atlas</title>   <script language="Javascript" type="text/javascript">   window.onload = function() {     Type.registerNamespace("ORA.MyEnums");     Type.createEnum(     "ORA.MyEnums.Ajax",     "Asynchronous", 0,     "JavaScript", 1,     "and", 2,     "XML", 3);     for (var element in ORA.MyEnums.Ajax.getValues()) {     document.getElementById("output").innerHTML += element + " ";     }   }   </script> </head> <body>   <form  runat="server">     <atlas:ScriptManager  runat="server" EnableScriptComponents="false">     </atlas:ScriptManager>     <div ></div>   </form> </body> </html>

This code outputs the string "Asynchronous JavaScript and XML " in the <div> element.

The main use of the Atlas enumerations lies in these two helper functions:

valueFromString(s): Returns the value (index) in the enumeration associated with the given string
ValueToString(value): Returns the key for the given value (index)

Enumerations are also used internally by Atlas, for instance to create a set of browser types:

 Type.createEnum('Sys.HostType', 'Other', 0, 'InternetExplorer', 1, 'Firefox', 2);

So as you can see, Atlas offers some interesting additional features for client scripting: new OOP constructs can help structuring complex code, and JavaScript versions of .NET classes add familiarity to the coding process.