ALL POSTS BY

Blog

Node.JS in relayr and ECMAScript6

For about a year now, we have transitioned and refactored most of our Node.js code base to ECMAScript6 from ES5.

 

What is EcmaScript you ask?

ECMAScript is a subset of JavaScript. JavaScript is basically ECMAScript at it's core but builds upon it. Languages such as ActionScript, JavaScript, JScript all use ECMAScript as its core. As a comparison, AS/JS/JScript are 3 different cars, but they all use the same engine. They differ in their exteriors though, and modifications make each one unique.

 

Credit goes to “Meder” for the well put explanation (stackOverflow)

 

Structure and elegance

One of the most useful things that we use is the ES6 const. Finally, a nicer way to make read-only variables. This is extremely useful for environments, configurations and settings.

Here’s a small example:

 

<code>
const configuration = {
	production:{
	api:”relayr.io”,
	keyPair:”relayr”
},
	development:{
	api:”dev.relayr.io”,
	keyPair:”dev-relayr”
}
}


Another one of my favourite things is the Let declaration. An end to global variables! Hello scoped mighty fine Let’s. With let you can finally put the right variables in the correct scope.

For example:

 

<code>
if (batman > superman){
	let status = false; //<--- the status boolean will only be accessible inside this “IF” scope.
}

console.log(status) ← will give us an undefined value

 

Go to relayr's Developer Dashboard   to check out IoT projects and documentation!

 

Escaping callback hell

In ES6 we have a very useful and elegant way of halting a function. This is a dream come true in JavaScript. In the early days, you would need to create a callback for basically everything! This was a great way to pass objects and trigger cross-methods calls. However, using callbacks can become very messy once you depend multiple callbacks for a final callback you end up in what we call “Callback hell” or the “Pyramid of doom”

 

Here is an example of that:

 

NodeJS_pyramid

 

So this is where yield comes in handy. Instead of triggering a callback every time something is finished we can use Promises. This will give us the opportunity to return our callbacks in a Promise and fetch the data in a multi-threaded structure.

 

JavaScript is single threaded, meaning that two bits of script cannot run at the same time, they have to run one after another. Promises provide a mechanism to handle the results and errors from asynchronous operations. You can accomplish the same thing with callbacks, but promises provide improved readability via method chaining and succinct error handling.

 

<code>
return ()=> {
    yield loadLink(win , REMOTE_SRC+'/assets/css/style.css');
    yield loadLink(win , REMOTE_SRC+'/lib/async.js');
    yield loadLink(win , REMOTE_SRC+'/lib/easyXDM.js');
    yield loadLink(win , REMOTE_SRC+'/lib/json2.js');
    yield loadLink(win , REMOTE_SRC+'/lib/underscore.js');
    yield loadLink(win , REMOTE_SRC+'/lib/backbone.js');
    yield loadLink(win , REMOTE_SRC+'/dev/base_dev.js');

    let userInfo = yield api.getUser(); //<-- this line returns a promise after the http call responds with a JSON object.

    console.log(userInfo.email); //<-- this line will not fire until the yield is finished
}

 

So you can see how elegant and efficient the code looks and behaves. For those of you that have used Async in C#, this is a very similar experience.

 

The word “Function” repeats too much!

 

Probably my most favorite part of ES6 is are the Arrow functions. Purely a cosmetic change, but it just makes the code so damn pretty.

 

Here is an example of traditional JavaScript:

 

<code>
    this.util = function(){
        return {
            parse: function(obj){

            },
            update: function(obj){

            },
            create: function(parameter){

            }
        }
    }

 

Here's an example of Arrow functions:

 

<code>
    this.util = (){
        return {
            parse: (obj)=>{

            },
            update: (obj)=>{

            },
            create: (parameter)=>{

            }
        }
    }

 

relayr

Overall, ES6 offers us a smoother and more elegant code writing experience. We are constantly pushing the boundaries of JavaScript in the Internet of Things industry and with these new EcmaScript improvements we firmly believe you can build high quality production ready professional applications and services using this stack.

 

Go to relayr's Developer Dashboard   to check out IoT projects and documentation!