Web Standards based app building means more logic in our client side code (HTML and JavaScript).

When you’re moving from a language like C++, Java or C# that means adapting to find alternatives to language constructs in those languages.

So, this will be the first in an ongoing series on constructs in JavaScript.

I’m building a workout timer application and I’m doing in the 3 stages.

  1. A standard, connected, web page with all logic on the client but no “new wave” features.
  2. An enhanced version with Off Line, Local Storage, and other HTML5 goodness.
  3. An enhanced experienced for “when connected” times.

I’ve been writing C# for more than a decade and, though I’m happy with other server-side dialects, I do love C#.

One of the constructs that I ran in to is Enumerated Types.

There is no actual ENUM type in JavaScript but there are was that we can get close.

One this to note is that we don’t get all the benefits that we get using the ENUM type in Java or C#. We don’t get type safety, for example.

We can fake enums in a few ways. First we can declare a pseudo-enum as a collection of dictionary pairs and then access the entries using a convenient dot syntax.

Like this – variable.entry


var Mode = { "NONE": 0, 
             "PAUSED": 1, 
             "WORK": 2, 
             "REST": 3, 
             "HIGH": 4, 
             "LOW": 5, 
             "LOW": 6 };

var TimerState = Mode.NONE;

We can also make our pseudo-enum immutable by freezing the object when the number of options for the emun will or should never be changed.


var DaysOfTheWeek = { "Sunday":1, 
                      "Monday":2, 
                      "Tuesday":3, 
                      "Wednesday":4, 
                      "Thursday":5, 
                      "Friday":6, 
                      "Saturday":7				 
                    }
Object.freeze(DaysOfTheWeek);

The Object.Freeze method was added to JavaScript in version 1.8.5 ( Read HERE )

Since JavaScript is loosely types, we could even make our pseudo-enum a collection of Object like this.


var SIZE = {
  SMALL : {value: 0, name: "Small", code: "S"}, 
  MEDIUM: {value: 1, name: "Medium", code: "M"}, 
  LARGE : {value: 2, name: "Large", code: "L"}
};

Since we don’t get type safety I could still assign any value that I wanted to a variable that I indent to contain only one of the enumerated values.

Example:


var DaysOfTheWeek = { "Sunday":1, 
                      "Monday":2, 
                      "Tuesday":3, 
                      "Wednesday":4, 
                      "Thursday":5, 
                      "Friday":6, 
                      "Saturday":7				 
 }
 
 var myDay = DaysOfTheWeek.Friday;
 
 myDay = 99;
 
 myDay = "JunkData";

None of these would cause a run-time error but the last 2 would break the semantic intent of the myDay variable.

We just need to write GOOD code.

I still find great value in using these pseudo-enums. In my particular application I’m writing some pretty complex JavaScript code to implement an interval time with various states. The use of this technique not only make the code easier to understand but most JavaScript aware editors that support auto-suggest will reflect on the pseudo-enum and provide assistance when using them.