The Latest JavaScript

The latest JavaScript–1.7, 1.8 or 1.9, depending on how you think about it–is as fun to program as Python or Ruby. We’ve argued for years that JavaScript is an essential, respectable, and capable language; now it’s even comfortable.

“Comfort” and “fun” are challenges to present objectively; for today, let’s focus on a few language capabilities you might not recognize, and let you decide how they ought to fit in your own programming.

Version Jumble

For a long time, our own JavaScript programming was conservative; we focused on minimalism and careful use of libraries like jQuery. While JavaScript is a fine object-based language, and individual programmers have produced all sorts of esoteric prodigies with it, we never found as much character in it as other languages provide: Tcl, Lua, Forth, Erlang, and many others. In (early) JavaScript, iteration through a list demanded a list index! That certainly didn’t feel like high-level programming.

Now it’s 2009 though, and we all have at least Firefox 3.0 available, or should. Firefox 3.0 builds in 1.8 of JavaScript, which means that Array and String generics, iterators, closures, generators and generator expressions, comprehensions, strict interpretation, and more are all available for programming. 1.7 is not yet fully supported by the browsers other users might have, so judge soberly what your situation is before deciding on these features. There are plenty of reasons to like Firefox 3.0 and 3.5, though, and, if you know you can count on them, or are willing to include a compatibility library for other browsers, you ought to take advantage of modern JavaScript.

There are plenty of sources on the Web for detail on JavaScript, so we write on it only rarely. A few examples, though, will give “Regular Expressions” readers a glimpse of how current JavaScript looks:

Iterators, Closures, Lambdas, and More

For most of JavaScript’s history, the simplest JavaScript collection data structure has been the Array. You initialize and display a list of the largest USA cities this way:

var cityArray = ['New York City', 'Los Angeles', 'Chicago', 'Houston'];
      for (i = 0; i < cityArray.length; i++) {
	document.writeln(cityArray[i]);
      }

It was possible to write

var cityHash = []
      cityHash["first"] = 'New York City'; 
      cityHash["second"] = 'Los Angeles';
      cityHash["third"] = 'Chicago';
      cityHash["fourth"] = 'Houston';
      for (cityIndex in cityHash) {
	document.writeln(cityHash[cityIndex]);
      }

This approach doesn’t always honor naive expectations, though, because cityHash isn’t a Hash or Associative Array as other languages understand it. cityHash.length is zero. cityIndex in cityHash computes all cityHash’s properties, so introduction of a framework or debugger might bring surprises.

JavaScript 1.6 gives the possibility to code with a new built-in forEach instead:

      var cityArray = ['New York City', 'Los Angeles', 'Chicago', 'Houston'];
      cityArray.forEach(function(item, index) {
			   document.writeln(item);
			});

In this case, of course, document.writeln() is already a named function, so the expression can be abbreviated to

      var cityArray = ['New York City', 'Los Angeles', 'Chicago', 'Houston'];
      cityArray.forEach(document.writeln);

What’s interesting, though, is the opportunity to inline anonymous actions exactly at the point of their use by forEach or other relatively new JavaScript methods such as map, every, and filter.

JavaScript now has not only anonymous functions, but even closures. Quite a few languages have acquired closures over the last decade, and programmers are learning to make more stylish use of them. Here’s an example of use of a closure in JavaScript:

      function tell_accumulator() {
	var accumulator = 0;
	var fireAlert = function() {alert(accumulator);}
	accumulator++;
	return fireAlert;
      }

Do you see what value tell_accumulator pops up the first time it’s invoked?

Comprehensions are another powerful novelty for JavaScript. Just this week we needed code something like

      var active_sessions = [session_name(code) for each 
                                    (code in actives) if budget(code) > 0];     

In earlier environments, this would have required coding such as

      var active_sessions = [];
      active_counter = 0;
      for (i = 0; i < actives.length; i++) {
	if (budget(actives[i]) > 0) {
	  active_sessions[active_counter++] = session_name(actives[i]);
        }
      }

We like the maintainability the array comprehension brings the former definition.

Summary

We repeat: there are many fine references to help learn JavaScript. JavaScript: The Good Parts, for example, is accurate, insightful, and just published this spring. We’ve only hinted at the advantages of recent JavaScript, let alone all the other exciting ferment SVG, canvas, JSON, introspection, DOM persistence, and so on bring modern browsers. Install Firefox 3.5, and learn the new possibilities for yourself. Your JavaScript programming horizons will expand more than you realize.