Skip to main content

Três novidades no ES2018 que você precisa conhecer




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 nextretorna 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 finallyserá 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.

Comments

Popular posts from this blog

Criando um filtro de busca customizável com JavaScript funcional

Tutoriais utilizando bibliotecas e frameworks para state management se tornaram comuns. Apesar disso, já que muita gente usa muitos frameworks diferentes, muitas vezes precisamos falar sobre a plataforma que permite isso tudo: a odiadíssima ferramenta que é o JavaScript, na sua forma mais pura — conforme descrito com documentações excelentes como a da MDN . Esse tutorial também pode ser útil para quem está iniciando em JavaScript e desenvolvimento em geral já começar com alguma ideia do que é programação funcional. O termo está se tornando popular e quem não subir nesse barco pode ficar para trás em pouco tempo. Não vamos adentrar nos detalhes do que é programação funcional neste artigo — isso é assunto para outras horas de conversa. Aqui, ficaremos no rápido e simples: alcançar nosso objetivo, evitando mutações dos dados e estado global. Iniciando o projeto Pelo bem da simplicidade, vamos manter tudo num único arquivo, que vai ter essa cara: <!DOCTYPE HTML> ...

Verificar sequencia de caracteres iguais em uma string c#

Neste post vamos ver como explorar uma string e verificar se existe uma seqüencia de caracteres iguais dentro da string. Utilizaremos a tabela ASCII para verificar letras e números, se você precisar verificar mais caracteres basta consultar a tabela e colocar o número referente na condição. Neste exemplo vou verificar se existe na string uma seqüencia quatro(4) números iguais e o mesmo para uma seqüencia de três(3) letras, pois acho que em números de documentos ou nomes isto não pode acontecer. Tabela de decimal ASCII public static bool ValidaTexto(this string txt) { bool flag = true; if (txt.Length < 3) { flag = false; } else { int contLetras = 0; int contNumeros = 0; int tmp = (int)txt.ToCharArray()[0]; foreach (char c in txt.ToCharArray()) { if (((int)c < 127 && (int)c >= 65)) { if (tmp == (int)c) { contLetras++; } if (contLetras >= 3) { break; } tmp = (int)c; } } //inicia novamente o armazenador tmp =...

Posts e consultas no twitter pelo windows phone 7 part 2 de 2

No artigo anterior ( Posts e consultas no twitter pelo windows phone 7 part 1 de 2 ) no vimos como construir uma aplicação no windows phone 7 que faça consultas no twitter utilizando o api do twitter; Neste artigo vamos tentar construir nesta mesma aplicação algo que o usuário possa fazer o login no twitter, visualize seus posts e adicione novos. No passo anterior no menu da aplicação nos deixamos um item chamado "login" que servira pra redirecionar para uma tela que o usuário possa efetuar o login no twiter; Para que essa parte da aplicação funcione  precisamos registrar nossa aplicação no twitter; Acesse dev.twitter.com . A aplicação deve ser to tipo Browser e a Callback URL informada, essa é uma das exigências do twitter, como nos vamos utilizar a URL do google( http://www.google.com ). Apos o registro da aplicação  o twitter retorna as url's necessárias para as transações. Para conseguirmos buscar e enviar informações no twitter vamos util...