O que há de novo no padrão ES2021 para JavaScript?

O lançamento anual do ECMAScript está aqui, trazendo novos recursos e melhorias de sintaxe. A especificação foi finalizada pela organização de padrões internacionais ECMA em 22 de junho de 2021, indicando que agora está pronta para uso.

A implementação mais popular de

ECMAScript &’ s é JavaScript, a linguagem suportada por navegadores da web e ambientes de nuvem por meio de tempos de execução como Node. js. Aqui está um resumo das principais mudanças no ES2021.

Promise. any ()

Promise. any () completa o suporte agregado de tratamento de erros para promessas. Ele entrará em curto-circuito e retornará assim que um dos objetos da Promessa passados ​​for cumprido.

Se todas as promessas falharem, o método rejeita com um novo AggregateError. Este objeto encapsula os motivos de rejeição para cada um dos erros individuais.

const promises = & # 91; doSomething & # 40; & # 41 ;, doSomethingElse & # 40; & # 41; & # 93 ;;   tente & # 123;   // Este será o valor de retorno de `doSomething ()` // ou `doSomethingElse ()`, dependendo de qual // resolve firstconst firstToResolve = await Promise. any & # 40; promises & # 41 ;;   & # 125;   detectar & # 40; erros & # 41; & # 123;   para & # 40; erro constante de erros & # 41; & # 123; // Iterar os motivos de rejeição da promessa individual & # 125;   & # 125;

Promise. any () é útil em cenários onde você precisa agir se pelo menos uma promessa for resolvida, mas não importa se alguma falhar. Ele complementa os métodos Promise. all () e Promise. allSettled () existentes.

Aqui está um rápido resumo das diferenças:

• any () – Resolve se alguma promessa for resolvida. Rejeita se todas as promessas forem rejeitadas.
• all () – Resolve se todas as promessas forem resolvidas. Rejeita se qualquer promessa for rejeitada.
• allSettled () – Resolve assim que todas as promessas forem resolvidas ou rejeitadas. Este método não rejeita.

Operadores de atribuição lógica

ES2021 vem com algumas melhorias de operador há muito solicitadas. Novos operadores de atribuição lógica fornecem curto-circuito conveniente que resulta em menos código para escrever.

Publicidade

Os três operadores (& & =, || = e ?? =) combinam sua comparação lógica correspondente com uma atribuição de valor. Você não precisa mais escrever o nome da variável duas vezes se estiver atribuindo apenas quando a comparação corresponder:

// ES2020 x & & & # 40; x = y & # 41; x || & # 40; x = y & # 41; x = x ?? y   // ES2021 x & & = y; x || = y; x ?? = y;

Isso ajuda a arredondar o suporte do operador e reduz a repetitividade do código de atribuição pesada. Fornece aos operadores lógicos a mesma integração de atribuição que os operadores matemáticos (+ =, - =, * =).

String. prototype. replaceAll ()

Um novo método no protótipo String torna muito mais fácil substituir todas as instâncias de uma sub-string, sem recorrer a um regex. Quando o método replace () existente recebe uma string como sua entrada, ele apenas substitui a primeira instância desse valor. replaceAll () adiciona o comportamento que muitos desenvolvedores desejam e esperam.

const str = " xxxyz & quot ;;   // xxyz console. log & # 40; str. replace & # 40; " x ", " " & # 41; & # 41 ;;   // yz console. log & # 40; / x / g, " " & # 41 ;;   // yz console. log & # 40; str. replaceAll & # 40; " x ", " " & # 41; & # 41 ;;

É um pequeno recurso que deve ter utilidade imediata no mundo real. Uma chamada replaceAll () aumenta a legibilidade do código em comparação com uma regex com um modificador g (global). Isso é especialmente verdadeiro quando você está trabalhando com desenvolvedores menos experientes que podem não ter certeza de por que a regex foi usada.

Separadores numéricos

Uma mudança simples adiciona separadores numéricos à sintaxe JavaScript básica. Isso permite que você coloque sublinhados entre os dígitos em números literais, tornando-os mais legíveis. Eles serão removidos automaticamente quando seus arquivos forem analisados.

// ES2020 - Isso é difícil de ver de relance! const bilhões = 1000000000;   // ES2021 - Isso pode ser mais legível - bilhão = 1_000_000_000;

Publicidade

Os separadores imitam a maneira como as vírgulas são usadas entre grupos de números escritos. Seu uso é totalmente opcional. A sintaxe também funciona para literais binários e hexadecimais prefixados com 0b e 0x.

Recursos avançados

ES2021 inclui alguns novos objetos voltados para casos de uso mais avançados. Primeiro, há WeakRef, um mecanismo que mantém uma referência a um objeto, mas o mantém qualificado para a coleta de lixo. A referência é “ fraca ” porque não há garantia de que ele poderá ser usado no futuro.

Você poderá acessar o objeto até que ele seja coletado como lixo. Pode não ser coletado como lixo, pois cabe ao navegador remover objetos não referenciados.

Você cria referências fracas com o construtor WeakRef, passando o objeto que deseja usar. Você pode acessar o objeto original posteriormente chamando deref ().

const x = & # 123; & # 125 ;; const xWeakRef = new WeakRef & # 40; x & # 41 ;;   const deRef = xWeakRef. deref & # 40; & # 41 ;; // este é o objeto de `x`

Referências fracas devem ser usadas para armazenar em cache objetos grandes que não são essenciais para o seu aplicativo. O navegador será capaz de limpá-los em momentos de pouca memória, melhorando o desempenho geral.

Junto com referências fracas, o novo construtor FinalizationRegistry fornece notificações quando os objetos são coletados como lixo. Não é possível cancelar a coleta de lixo; esse recurso tem como objetivo permitir que você responda a limpezas, liberando quaisquer outros recursos associados. Por exemplo, se um objeto que representa um usuário foi coletado como lixo, você pode usar o retorno de chamada para excluir um blob em cache da foto do perfil.

const registry = new FinalizationRegistry & # 40; key = > & # 123; // Este retorno de chamada será executado quando um // objeto registrado for lixo coletadoif & # 40; key == = " usuário " & # 41; & # 123; // Exclua aqui os dados do usuário em cache. & # 125; & # 125; & # 41 ;;   const user = & # 123; Nome de usuário: " CloudSavvy " & # 125 ;; registry. register & # 40; usuário, " usuário " & # 41 ;;

Publicidade

Neste exemplo, seu retorno de chamada será executado e receberá o usuário como seu parâmetro quando o objeto x for coletado como lixo. Você pode usar a chave para identificar e remover dados semelhantes. Você precisará criar esse mecanismo sozinho.

Conclusão

ES2021 é uma atualização de especificação saudável que traz novos recursos de conveniência para a comunidade ECMAScript. Promise. any () completa a linha de tratamento de promessas, enquanto os operadores de atribuição lógica e replaceAll () aumentam a facilidade de uso diário.

Embora tenham acabado de ser finalizados, os recursos do ES2021 foram enviados nos navegadores o ano todo Chromium, Firefox e Safari já oferecem suporte ES2021 completo, então você pode escrever código usando os novos recursos hoje. Recursos como Promise. any () e String. prototype. replaceAll () podem ser prontamente preenchidos para navegadores mais antigos; outros, como operadores de atribuição lógica, podem ser manipulados por pré-processadores como o Babel.