Javascript ES8

EcmaScript 8 or EcmaScript 2017 was officially released at the end of June by TC39. It seems that we are talking a lot about EcmaScript in the 2016. The standard is to publish a new ES specification version once a year. ES6 was published in 2015 and ES7 was published in 2016, but do someone remember when ES5 was released? It happened in 2009, before the magical rise of JavaScript. In this article we are going to discuss about ES8 and its new features. So, explore this article and know more about EcmaScript 8.

OBJECT.VALUES AND OBJECT.ENTRIES

The Object.values method returns an array of a given own object’s enumerable property values, in the same order as that provided on behalf of a loop. The declaration of the function is trivial.

Object.values(obj)

The obj parameter is the source object for the operation. It can be an object or an array.

const obj = { x: ‘xxx’, y: 1 };
Object.values(obj); // [‘xxx’, 1]

const obj = [‘e’, ‘s’, ‘8’]; // same as { 0: ‘e’, 1: ‘s’, 2: ‘8’ };
Object.values(obj); // [‘e’, ‘s’, ‘8’]

// when we use numeric keys, the values returned in a numerical
// order according to the keys
const obj = { 10: ‘xxx’, 1: ‘yyy’, 3: ‘zzz’ };
Object.values(obj); // [‘yyy’, ‘zzz’, ‘xxx’]

Object.values(‘es8′); // [‘e’, ‘s’, ‘8’]

The Object.entries method returns an array of a given object’s own enumerable property [key, value] pairs, in the same order as Object.values. The declaration of the function is trivial:

const obj = { x: ‘xxx’, y: 1 };
Object.entries(obj); // [[’x’, ‘xxx’], [’y’, 1]]

const obj = [’e’, ‘s’, ‘8’];
Object.entries(obj); // [[’0’, ‘e’], [’1’, ‘s’], [’2’, ‘8’]]

const obj = { 10: ‘xxx’, 1: ‘yyy’, 3: ‘zzz’ };
Object.entries(obj); // [[’1’, ‘yyy’], [’3’, ‘zzz’], [’10’, ‘xxx’]]

Object.entries(‘es8′); // [[‘0′, ‘e’], [‘1′, ‘s’], [‘2′, ‘8’]]
This section adds two functions to the String object i.e. padStart & padEnd.

As their names, the purpose of those functions is to pad the start or the end of the string, so that the resulting string reaches the given length. The user can pad the specific character or string or just pad with spaces by default. Below are the functions declaration.

str.padStart(targetLength [, padString])
str.padEnd(targetLength [, padString])

As we can see, the first parameter of the functions is the targetLength, that is the total length of the resulted string. The second parameter is optional padString that is for the string to pad the source string. The default value is space.

‘es8′.padStart(2); // ‘es8′
‘es8′.padStart(5); // ‘ es8′
‘es8′.padStart(6, ‘woof’); // ‘wooes8′
‘es8′.padStart(14, ‘wow’); // ‘wowwowwowwoes8′
‘es8′.padStart(7, ‘0’); // ‘0000es8′
‘es8’.padEnd(2); // ‘es8′
‘es8’.padEnd(5); // ‘es8 ‘
‘es8’.padEnd(6, ‘woof’); // ‘es8woo’
‘es8’.padEnd(14, ‘wow’); // ‘es8wowwowwowwo’
‘es8’.padEnd(7, ‘6’); // ‘es86666′

OBJECT.GETOWNPROPERTYDESCRIPTORS

EcmaSript lacks a method for properly copying properties between two objects. This proposal solves this seemingly simple but complex problem that has been implemented at times in almost every JS toolkit or framework. Currently it is a stumbling block for efficient immutability, true composition of ES Classes, something that would benefit Decorators, and just less surprising in general than Object.assign.

ASYNC FUNCTIONS

The async function declaration defines an asynchronous function, which returns an AsyncFunction object. Internally, async functions work much like generators, but they are not translated to generator functions.

function fetchTextByPromise() {
return new Promise(resolve => {
setTimeout(() => {
resolve(“es8″);
}, 2000);
});
}

async function sayHello() {
const externalFetchedText = await fetchTextByPromise();
console.log(`Hello, ${externalFetchedText}`); // Hello, es8
}

sayHello();

The call of sayHello will log Hello in es8 after 2 seconds.
console.log(1);
sayHello();
console.log(2);

And now the prints are:
1 // immediately
2 // immediately
Hello, es8 // after 2 seconds

This is because the function call does not block the flow.

Pay attention that an async function always returns a promise and an expect keyword may only be used in functions marked with the async keyword.

SHARED MEMORY AND ATOMICS

When memory is shared, multiple threads can read and write the same data in memory. Atomic operations make sure that predictable values are written and read, that operations are completed before the next operation starts and that operations are not interrupted. This section introduces a new constructor SharedArrayBuffer and a namespace object atomics with static methods.

The atomic object is an object of static methods such as math, so we cannot use it as a constructor. Examples for static method in this object are:

add / sub— add / subtract a value for the value at a specific position.
and / or / xor — bitwise and / bitwise or / bitwise xor.
load — get the value at a specific position.

THE VERDICT

JavaScript is in production, but it is always getting improved. The process of adopting new features to the specification is very arranged and composed. In the previous stage, these features were confirmed by the TC39 committee and implemented by the core developers. Most of them are already parts of the Typescript language, browsers or other polyfills, so the user can go and try them right now.