Três novidades no ES2018 que você precisa conhecer

Por:
Em:

O JavaScript não para de evoluir. Desde a primeira grande atualização na linguagem, em 2015 com o ES6 (depois rebatizado para ES2015), temos lançamentos anuais com correções, melhorias e novas funcionalidades.
O processo de atualização é coordenado pelo TC39, um comitê que conta com membros da comunidade e representantes de grandes empresas.
Um fato muito legal sobre o TC39: temos um brasileiro que é membro ativo do comitê, o Leo Balter.
Temos aqui no portal uma entrevista que fizemos com o Leo em 2016, na qual ele conta um pouco como o comitê funciona.

O ES2018 nos traz algumas novidades e melhorias bem interessantes.
Em junho de 2018 já devemos ter a versão oficializada pela ECMA International.

Agora, vamos conhecer três das funcionalidades oferecidas 👌

Asynchronous Iteration

O ES2015 trouxe muitas novidades. Uma delas foi o iterator (iterador), um objeto que oferece a funcionalidade de navegar entre os itens de uma lista ou estrutura – um a um – em sequência. Este objeto oferece o método next, o qual retornará o próximo item da lista no seguinte formato:

{
  value: Mixed,
  done: Boolean
}

Você pode saber mais sobre Iterators no post Generators, yield e iterators, aqui no portal.
Iterators são muito legais e nos dão N possibilidades, porém, Iterators somente funcionam em dados síncronos.
Veja um exemplo:

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let it = arr[Symbol.iterator]();
console.log(it.next().value); // 1
console.log(it.next().value); // 2
console.log(it.next().value); // 3
console.log(it.next().value); // 4

A novidade no ES2018 é a sua possibilidade assíncrona.
Um iterator assíncrono, basicamente, é um iterator. Entretanto, o método next retorna uma Promise.

const { value, done } = syncIterator.next();
asyncIterator.next().then(({ value, done }) => /* ... */);

Para fazer a iteração, agora temos o for await of, que faz exatamente o que parece, itera objetos iteráveis assincronamente. Legal, né? 🔥

for await (const line of readLines(filePath)) {
  console.log(line);
}

Veja mais na documentação da proposta.

Object Rest/Spread Properties

rest e spread também entraram no ES2015.
A sintaxe chamada de “destructuring assignment” é uma expressão JavaScript que torna possível descompactar valores de arrays ou propriedades de objetos e atribuir a variáveis novas.

Vejamos um exemplo:

var a, b, rest;
[a, b] = [10, 20];

console.log(a);
// expected output: 10

console.log(b);
// expected output: 20

[a, b, ...rest] = [10, 20, 30, 40, 50];

console.log(rest);
// expected output: [30,40,50]

Veja mais sobre destructuring na MDN.

Basicamente, o ES2018 introduz a mesma possibilidade para objetos.

Rest:

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x; // 1
y; // 2
z; // { a: 3, b: 4 }

Spread:

let n = { x, y, ...z };
n; // { x: 1, y: 2, a: 3, b: 4 }

Veja mais na documentação da proposta oficial.

Promise.prototype.finally()

Promises já estão no nosso dia a dia há um bom tempo.
Desenvolvedores JavaScript já vinham utilizando Promises antes mesmo de se tornar parte da linguagem (usando bibliotecas), também no ES2015.
A novidade do ES2018 é que agora Promises terão o finally.
Muitas bibliotecas existentes implementam o método finally, que é um callback para quando uma Promise está pronta, seja como fulfilled ou rejected.
Podemos pensar no finally como o já conhecido try/catch/finally, no qual o finally será sempre executado.

promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});

Veja mais na proposta oficial.

Conclusão

O ES2018 ainda traz outras novidades e melhorias, como novas funcionalidades para expressões regulares (RegExp) e uma revisão nos template literals.
O Dr. Axel Rauschmayer faz um excelente trabalho em seu blog 2ality, e lá ele escreveu sobre todas as novidades no post ECMAScript 2018: the final feature set.

Cursos recomendados pela BrazilJS

    Patrocinadores BrazilJS

    Gold

    Silver

    Bronze

    Apoio

    BrazilJS® é uma iniciativa NASC.