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

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 =...

CRIANDO APLICATIVOS DO ZERO E FÁCIL!

O QUE VOCÊ VAI APRENDER? SÃO MAIS DE 10 HORAS DE CONTEÚDO PURO E MATERIAIS EXTRAS: CRIAR APLICATIVOS   Mesmo sendo um total iniciante vamos explicar para você como criar aplicativos profissionais. Utilizaremos a linguagem HTML, CSS, Javascript em união com Apache Cordova. MODELO DE NEGÓCIO  Vamos ensinar como ganhar dinheiro* fazendo aplicativos. Apresentamos os 4 pilares básicos para a monetização de um aplicativos e como fazer para ser bem-sucedido. ATENDIMENTO AO CLIENTE - Vamos dar atenção também a parte humana do processo. Como técnicas de atendimento e precificação, para você convencer seus futuros clientes a fechar negócio com você. Veja os módulos do curso aqui POR QUE FAZER ESTE CURSO? CERTIFICAÇÃO PROFISSIONAL A conclusão deste curso oferece certificação profissional válida em todo território nacional. Podendo portanto ser colocado no seu curriculum, com duração total de 10 horas. GARANTIA Se por algum motivo você achar que est...

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> ...