Interesting thing coming in ECMAScript 6

Javascript always has been the poor cousin to all that whizz-bangery that happens on a server and as a result anything new coming down the pipe line kinda gets lost in the news-stream of super-duper server improvements.

I try were possible to keep up to speed with what's about to come along and it was with this in mind I I was casting my eye over Juriy Zaytsev's EMCAScript 6 compatibility chart and I started to notice green's appear. Some of the current or beta versions of the browsers are starting to support the new V6 changes so it shouldn't be that long until we start to see them in the wild and can start to use them in anger.
(if you are interested in the EMCAScript 6 Draft Doc you can download it here)

Of the changes coming I am piqued by the idea of

1. Modules

While there are some JS libraries that do something very similar ES6 will provide support for modules, the rational behind this is to provide for:

• Standardized mechanism for creating libraries.
• In-language loading of external modules (non-blocking, direct style).
• Portability between different host environments.
• Future-proof mechanism for platforms to introduce experimental libraries without collision.
• No installation/registration code within modules.

As Modules are static by default (but can be dynamically reflected) this makes them far more compatible with static scoping. Modules are loaded from the filesystem or network in direct style instead of by callbacks and this means the main thread of execution is not blocked by the load.

It is hoped that Modules will be used for scoping and their implementation preserves and promote static, lexical scoping, thus avoiding the many problems of dynamic scope: programming pitfalls, malicious scope injection, poor performance and  lack of modularity. Static scoping is also necessary for checking for unbound variables at compile time.

A simple module would look like this

module orders {
export function ASP(qty,val) { return val/qty; }
export var dollar = "$";
export var pound = "£";
}

This module would then be accessed in your JS code like this :

import orders( ASP ,  pound) from orders;
alert( pound+" "+ASP(ThisOrder.Quantity,ThisOrder.Value) );


I can see instances where this will be very useful!

More details on Modules can be found here

2. Object.Observe
Object.Observe gives us the ability to watch Javascript objects and report back changes to the application, changes like properties being added, updated, removed or reconfigured. When I am building a UI frameworks I often want to provide an ability to data-bind objects in a data-model to UI elements. A key component of data-binding is to track changes to the object being bound. Today, JavaScript frameworks which provide data-binding typically create objects wrapping the real data, or require objects being data-bound to be modified to buy in to data-binding. The first case leads to increased working set and more complex user model, and the second leads to siloing of data-binding frameworks. ES6 will get around this by providing a run-time capability to observe changes to an object. Here is interesting discussion on this soon to be available new feature

3 Default Parameter Values

Default parameter values allow us to initialize parameters if they are not explicitly supplied, so you can do things like


function dspInputPanel(footer = "Steve McDonagh")
{
       ... build inputPanel Object..
       footer.innerHTML = footer;
}

So when I call dspInputPanel() with no parameters the footer object will contain Steve McDonagh
if I call dspInputPanel("Anne Other") then the footer object will contain Anne Other

4. Block Scoping
There will be 2 new declarations available for scoping data in a single block

let which is similar to the var declaration but allows you to redefine a var in the let's block scope without changing the orginal var in the scope of the function

function doInterestingStuff()
{
         var x = 5;
         var y = 6;
         let (x = x*2,y =y*3) { alert( x+y ); }     // pops up 28
         alert(x+y)                                            // pops up 11
}

const is the other declaration and is like let but is used for read-only constant declarations

5. Maps
Arrays of Name - Value pairs have been around a long time in JS and ES 6 will introduce the new Map() object with it's functions SET(), HAS(), GET() and DELETE() that makes using them even easier

var myDogs = new Map();
myDogs.set("Fido","Poodle")
myDogs.set("Rover","Collie")
myDogs.has("Fido")                                 // Returns true
myDogs.get("Fido")                                 // Returns "Poodle"
myDogs.delete("Fido")                             // Returns true when deleted
myDogs.has("Fido")                                //  Now returns false

6. Sets
SETs are basically arrays and there is a new object creator Set() with associated methods HAS(), ADD() and DELETE()

var myCustomers = new Set( ["IBM","DELL","APPLE"] )
myCustomers.has("IBM")                   // returns true
myCustomers.add("ASUS")               // adds "ASUS" to the set
myCustomer.delete("IBM")                // Removes IBM from the set
myCustomer.has("IBM")                   // now returns false
This will allow array filtering to be so much easier, consider the following where I have an Array of customer names that I want to ensure is unique this new method is much much much easier to read.

function unique( customers )
{
       var ucust = new Set();
       return customers.filter(item) {
                                     if(!ucust.has(item)) { ucust.add(item) }
                                     return true;
                                     } 
}


There are loads more changes and improvements in the spec and it seems that ES6 is targeting a 2013 full spec release but as always some browsers are already implementing individual features and it's only a matter of time before their availability is widespread.

JS it seems may be coming out of the closet in the next 6 months and may soon be considered a "proper" language :-)