ES8 Features, TIME to update your JavaScript/ES7

See the ES2017 standard for full specification of the ECMAScript 2017 language.

ES2017 / ES8 features

ES2017 / ES8 includes the following new features:

Async functions
Object.entries
Object.values
Object.getOwnPropertyDescriptors
Trailing commas

async function

The asynchronous function returns an AsyncFunction object and operates asynchronously via the event loop. The syntax is very similar to synchronous functions

Syntax:

async function name(]]) { statements }
@name: the function name
@param: param of the function
statements: body of the function
returns: Promise

`const resolveAfter3Seconds = function() {
  console.log('starting 3 second promsise')
  return new Promise(resolve => {
    setTimeout(function() {
      resolve(3)
      console.log('done in 3 seconds')  
    }, 3000)  
  })  
}

const resolveAfter1Second = function() {
  console.log('starting 1 second promise')
  return new Promise(resolve => {
      setTimeout(function() {
        resolve(1) 
        console.log('done, in 1 second') 
      }, 1000)
  })  
}

const sequentialStart = async function() {
  console.log('***SEQUENTIAL START***')
  const one = await resolveAfter1Second()
  const three = await resolveAfter3Seconds()

  console.log(one)
  console.log(three)
}

sequentialStart() // invoke async function`

Object.entries()

Object.entries gives us the ability to get an object’s enurmerable property pairs by returning an array of any given object’s own eumberable properties. /ie: pairs. Note that the order is the same as provided by the for...in loop.

Syntax:

Object.entries(obj)
@params: obj
returns: Array

Examples:

basic example

`const obj = { self: 'that', norf: 'quux' }
console.log(Object.entries(obj))

// => [ ['self', 'that'], ['norf', 'quux'] ]`

array like object with random key ordering

`const obj = { 50: 'a', 1: 'b', 5: 'c' }
console.log(Object.entries(obj)) 

// => [ ['1', 'b'], ['5', 'c'], ['50', 'a'] ]`

Object.values()

Object.values lets us return an array of a given object’s own enumerable property values. Note that the order is the same as provided by the for...in loop.

Syntax:

Object.values(obj)
@params: obj
returns: Array

Examples:

basic example

`const obj = { a: 100, b: 200 }
console.log(Object.values(obj))

// => [100, 200]`

mixed

`const obj = { foo: 'foo', bar: [100, 200], baz: 55 }
console.log(Object.values(obj)) 

// => ['foo', [100, 200], 55 ]`

string

`const myStr = 'Lufthansa'
console.log(Object.values(myStr))

// => ["L", "u", "f", "t", "h", "a", "n", "s", "a"]`

Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptors() returns all own property descriptors of a given object. A property descriptor is a record with one of the following attributes:

value
writable
get
set
configurable
enumerable

`let myObj = {
  property1: 'foo',
  property2: 'bar',
  property3: 42,
  property4: () => console.log('prop4')  
}

Object.getOwnPropertyDescriptors(myObj)

`

Trailing Commas

Trailing commas in function declarations and calls are now allowed in JavaScript. When splitting the list of arguments over several lines, this results in better VCS diffs as only one line will be modified when adding a new parameter (instead of two).

trailing commas in function declaration and call

`function foo(
	bar,
	baz,
) {
	console.log(
		bar,
		baz,
	)
}`

trailing commas in arguments

`const func = (a,b,c,) => {
  // no error occurs
};`

Author: Dietmar Aumann