javascript está em constante evolução, e cada ano traz um novo conjunto de recursos projetados para facilitar a vida dos desenvolvedores. O ES2023, a atualização mais recente, está repleta de novas ferramentas que aprimoram como escrevemos, lemos e mantemos código. Vamos mergulhar em alguns dos recursos de destaque que você deseja começar a usar em seus projetos.

1. Array Findlast e FindLastIndex

você já precisou encontrar um item em uma matriz a partir do final? O ES2023 apresenta Findlast e FindLastIndex, que fazem exatamente isso.

• Findlast: Este método encontra o último elemento em uma matriz que atende a uma condição especificada.

  const numbers = [1, 2, 3, 4, 5];
  const lastEven = numbers.findLast(num => num % 2 === 0); // 4

  // Find last user who is 18 years old in large array
  const users = [/* array with 10000 users */]; 
  users.findLast(user => user.age === 18);

• FindLastIndex: Este método retorna o índice desse último elemento.

  const lastEvenIndex = numbers.findLastIndex(num => num % 2 === 0); // 3

Esses métodos são ótimos para aquelas situações em que você precisa reverter sua lógica de pesquisa, tornando seu código mais claro e potencialmente mais eficiente.

2. hashbangs (#!) Em arquivos javascript

Se você está escrevendo ferramentas de linha de comando no JavaScript, apreciará o novo suporte para hashbangs. Adicionando um #! Na parte superior do seu arquivo, você pode especificar diretamente o intérprete, tornando seu script executável sem precisar de um comando externo.

#!/usr/bin/env node

console.log("Hello, world!");

Este é um recurso pequeno, mas útil, especialmente para quem constrói ferramentas da CLI em Node.js.

3. símbolos como teclas de fracos

Anteriormente, apenas objetos podiam ser usados ​​como chaves no fracas, mas o ES2023 muda que também permitindo símbolos.

const wm = new frAchap (); const sym = símbolo ('chave'); WM.Set (Sym, 'Value'); console.log (wm.get (sym)); // 'valor' // armazenando dados de jogo ocultos que os jogadores não podem acessar facilmente, como os códigos de desbloqueio secretos: const SecretCode = Symbol ('vc-chega-código'); const gamedata = new frAchapMap (); gamedata.set (SecretCode, 'Panzer-aspirina-Bigbang-Preciousprotection');

const wm = new WeakMap();
const sym = Symbol('key');
wm.set(sym, 'value');

console.log(wm.get(sym)); // 'value'

// Storing hidden game data that players can't easily access, such as secret unlock codes:
const secretCode = Symbol('vc-cheat-code');
const gameData = new WeakMap();
gameData.set(secretCode, 'PANZER-ASPIRINE-BIGBANG-PRECIOUSPROTECTION'); 

Esse aprimoramento torna o fracas ainda mais versátil, principalmente quando você precisa de teclas exclusivas e sem colisão que os símbolos fornecem.

4.

agrupamento de matriz por método

agrupamento de elementos da matriz tornou -se muito mais fácil com o novo método do grupo.

Grupo: Este método organiza sua matriz em um objeto, com as teclas determinadas por uma função que você fornece e valores como matrizes de elementos que correspondem a cada tecla.

const Animals = [ {Tipo: 'Mammal', Nome: 'Dog'}, {Tipo: 'Bird', Nome: 'Sparrow'}, {tipo: 'Mammal', Nome: 'Cat'}, ]; const agrupado = animais.Group (({type}) => type); console.log (agrupado); // { // mamíferos: [{type: 'mammal', nome: 'cachorro'}, {type: 'mammal', nome: 'cat'}], // pássaro: [{type: 'Bird', nome: 'Sparrow'}] //}

const wm = new WeakMap();
const sym = Symbol('key');
wm.set(sym, 'value');

console.log(wm.get(sym)); // 'value'

// Storing hidden game data that players can't easily access, such as secret unlock codes:
const secretCode = Symbol('vc-cheat-code');
const gameData = new WeakMap();
gameData.set(secretCode, 'PANZER-ASPIRINE-BIGBANG-PRECIOUSPROTECTION'); 

Esse recurso é perfeito para cenários em que você precisa categorizar dados de maneira rápida e eficiente.

5.

Classificando as matrizes acabou de ficar muito mais limpa com o TOSORTED. Ao contrário de Sort, que altera a matriz original, o Tosorted retorna uma nova matriz classificada e a devoluções de devoluções, uma nova matriz invertida, deixando o original intocado.

const arr = [3, 1, 4, 1, 5]; const storedarr = arr.tosorted (); console.log (classificador); // [1, 1, 3, 4, 5] console.log (arr); // [3, 1, 4, 1, 5] deixe dados = [/ * dados importantes que não devem ser modificados */]; Seja revertedData = data.Toreversed (); // reverter com segurança

Este método é um ótimo ajuste para quando você precisa preservar a matriz original enquanto trabalha com uma versão classificada.

const arr = [3, 1, 4, 1, 5];
const sortedArr = arr.toSorted();
console.log(sortedArr); // [1, 1, 3, 4, 5]
console.log(arr); // [3, 1, 4, 1, 5]

let data = [/* important data that shouldn't be modified */];
let reversedData = data.toReversed(); // Safely reverse

6.

array.prototype.with

O método com uma maneira simples de criar uma nova matriz substituindo um elemento em um índice específico.

const números = [10, 20, 30, 40]; const newnumbers = números.with (2, 25); // [10, 20, 25, 40]

Este método é perfeito quando você deseja atualizar uma matriz imutável, facilitando o gerenciamento do estado em padrões de programação funcional.

const arr = [3, 1, 4, 1, 5];
const sortedArr = arr.toSorted();
console.log(sortedArr); // [1, 1, 3, 4, 5]
console.log(arr); // [3, 1, 4, 1, 5]

let data = [/* important data that shouldn't be modified */];
let reversedData = data.toReversed(); // Safely reverse

7.

Promise.withResolvers

O gerenciamento de promessas nunca foi tão fácil, graças a Promise.WithResolvers. Este novo método permite criar uma promessa junto com suas funções de resolução e rejeição de uma só vez.

const {prometo, resolve, rejeit} = prometo.withResolvers (); setTimeout (() => resolve ("feito"), 1000); promete.hen (console.log); // "feito"

é uma maneira legal e concisa de lidar com operações assíncronas, especialmente quando você precisa controlar o resultado da promessa de fora de seu construtor.

const arr = [3, 1, 4, 1, 5];
const sortedArr = arr.toSorted();
console.log(sortedArr); // [1, 1, 3, 4, 5]
console.log(arr); // [3, 1, 4, 1, 5]

let data = [/* important data that shouldn't be modified */];
let reversedData = data.toReversed(); // Safely reverse

Suporte ao navegador para ES2023

ES2023, a versão mais recente do JavaScript, é bastante nova, pois foi finalizada em 2023. Isso significa que nem todos os navegadores da web podem usar seus novos recursos ainda, mas eles estão começando a:

Firefox, Chrome e Edge oferecem suporte a alguns recursos Array.prototype.FindLast () e Array.prototype.findlastIndex ()

Safari ainda não suporta nenhum desses recursos.
• node.js

• node.js versão 19.0 e up podem usar:

  Array.prototype.findlast ()
  • array.prototype.findlastIndex () Espera -se adicionar mais recursos ES2023 em atualizações futuras.
  transpilers:
Para usar os novos recursos do ES2023 agora, os desenvolvedores podem transformar o código ES2023 em uma versão mais antiga que mais navegadores entendem, usando ferramentas chamadas transpilers, como Babel. Dessa forma, você pode começar a usar as coisas novas, mesmo que os navegadores ainda não estejam prontos para isso.

No momento, o suporte ao ES2023 ainda está crescendo. Grandes navegadores como Firefox e Chrome estão começando a incluir alguns de seus recursos. Para detalhes sobre o que é suportado onde, você pode conferir, posso usar. O uso de transpilers ajuda a tornar esses novos recursos utilizáveis ​​hoje, enquanto esperamos que os navegadores recuperem nos próximos anos.

Conclusão

ES2023 traz uma variedade de novos recursos que tornam o JavaScript mais poderoso e mais fácil de trabalhar. Desde métodos aprimorados de matriz até melhor manuseio de promessa, essas atualizações têm tudo a ver com tornar seu código mais limpo e mais eficiente. À medida que o JavaScript continua a crescer e evoluir, manter-se atualizado com essas mudanças garante que você esteja sempre tirando o máximo proveito do idioma.

Referências:

TC39 Propostas

rascunho ECMA-262
mdn