SIGN UP

ES7/2017 JavaScript syntax support

vox-es7-support-editor
Both our cloud JavaScript engine and Web JavaScript editor now support modern JavaScript syntax. You can use “let”, “const”, “async”, “await”, arrow functions and other features known as “ES2017”. You can write code with our web-based editor or upload your code via HTTP API from a version control system of your choice. Following post highlights a few features of the new syntax that we ourselves like the most.

async and await

Some of our APIs evaluates to Promise objects, and now you can use awaitinstead of then-chains:

 
// Before
VoxEngine.addEventListener(AppEvents.Started, async function(e) {
  var text1, text2, text3;
  Net.httpRequestAsync("www.ru")
    .then(function(e) {
      text1 = e.text;
      return Net.httpRequestAsync("ya.ru");
    })
    .then(function(e) {
      text2 = e.text;
      return Net.httpRequestAsync("mail.ru");
    })
    .then(function(e) {
      text3 = e.text
      doSomething(text1, text2, text3);
      VoxEngine.terminate();
    }
});
// After
VoxEngine.addEventListener(AppEvents.Started, async e => {
  const {text: text1} = await Net.httpRequestAsync("www.ru");
  const {text: text2} = await Net.httpRequestAsync("ya.ru");
  const {text: text3} = await Net.httpRequestAsync("mail.ru");
  doSomething(text1, text2, text3);
  VoxEngine.terminate();
});

Arrow functions and destructuring

Reduces code size, plain and simple. Additionally, destructuring can remove temporary identifiers by leaving only code that matters:

 
// before
call.addEventListener(CallEvents.MessageReceived, function(e) {
  var headers = e.headers;
  var text = e.text;
  doSomething(text, headers);
});

// after
call.addEventListener(CallEvents.MessageReceived, e => {
  const {headers, text} = e;
  doSomething(text, headers);
});

 

let and const

While modern JavaScript development relies on linters and compilers to check the source code, it’s often a need for a quick fix or test via the web-based editor. In such case “const” protects a developer from accident errors, while “let” serves as a fallback in case it wasn’t an accident:

 
// before
VoxEngine.addEventListener(AppEvents.CallAlerting, function(e) {
  var callIn = e.call;
  var callIn = VoxEngine.callPSTN("+71234567890"); // bug
  callIn.addEventListener(CallEvents.Connected, function(e) {
    VoxEngine.sendMediaBetween(callIn, callOut);
  });
});

// after
VoxEngine.addEventListener(AppEvents.CallAlerting, e => {
  const callIn = e.call;
  const callIn = VoxEngine.callPSTN("+71234567890"); // bug found!
  callIn.addEventListener(CallEvents.Connected, e => {
    VoxEngine.sendMediaBetween(callIn, callOut);
  });
});

 

String literals interpolation

Provides failsafe and cheap templating mechanics while protecting a developer from common string concatenation errors:

 
// before
call.say("Hello" + name + ", your order" + order + "will be delivered tomorrow");

// after. Watch the spaces!
call.say(`Hello ${name}, your order ${order} will be delivered tomorrow`);

 

Other features

ES2017 has much more useful features: of-loops, classes, helpers etc. It’s always a best practice to keep Voximplant scenarios small and move business logic into your backend. Still, modern JavaScript adds flexibility and protects developers who are using the full potential of our platform. If you have any questions about Voximplant, our cloud JavaScript, SDKs or any other functions -feel free to contact us via support@voximplant.com, we are always open to communicate with fellow developers!

Add your comment

Please, enter valid email

Get your free developer account or talk with our sales team to learn more about Voximplant solutions
SIGN UP
Contact sales

Please complete this field.

Please complete this field.

Please complete this field.

Choose the solution

Please complete this field.

Please complete this field.