À semelhança dos dois últimos ECMAS mencionados no último artigo deste âmbito, neste ECMAScript também não foram introduzidos recursos significativos. Houve apenas uma revisão do padrão ECMAScript anterior e a adição de novos operadores.

O ECMAScript 9 (ES9)

1. Propriedade 's' (dotAll) e Unicode Property Escapes:

O ES9 adicionou a flag 's' às expressões regulares, permitindo que o metacaractere especial de expressões regulares ponto (.) corresponda a qualquer caractere, incluindo mudança de linha (\n, \r, \u2028 e \u2029). Além disso, o ES9 introduziu a capacidade de usar "Unicode property escapes", que permite fazer correspondências baseadas em propriedades Unicode específicas.

Exemplo:

const regex = /foo.bar/s;
console.log(regex.test('foo\nbar')); // Output: true

const regexUnicode = /\p{Sc}/u;
console.log(regexUnicode.test('$')); // Output: true

Explicação:

Nos dois exemplos, lidamos com expressões regulares, por isso vou dividi-las em partes.

No primeiro caso:

• / e /: As barras indicam o início e o fim da expressão regular;
• foo.bar: Esta é a expressão regular em si. Ela contém a string "foo", seguida de um qualquer caractere indicado pelo ponto (.), seguido de uma sequência "bar";
• s: O "s" após a barra final é chamado de modificador ou flag. No exemplo, o "s" é chamado de modificador "dotAll", que altera o comportamento do metacaractere especial ponto (.). O modificador /s faz com que o ponto (.) corresponda a um qualquer caractere, incluindo mudanças de linha (\n, \r, \u2028 e \u2029);
• Validando a expressão, chamamos o método test() da expressão regular regex passando a string completa 'foo\nbar' como argumento, verificamos um resultado bolleano "true".

No segundo caso:

• / e /: As barras indicam o início e o fim da expressão regular;
• \p{Sc}: Corresponde a uma sintaxe especial para as "Unicode property escapes". Esta sintaxe é usado para corresponder a qualquer caractere que seja um símbolo monetário (como dólar, euro, etc.);
• u: O u após a barra final é um modificador unicode, indicando que a expressão regular está a usar caracteres Unicode;
• Validando a expressão, chamamos o método test() da expressão regular regexUnicode passando caractere '$' como argumento, verificamos um resultado bolleano "true".

2. Promise.prototype.finally():

O ES9 introduziu o método finally() na classe Promise.prototype, que permite usar um callback independentemente do resultado da Promise.

Exemplo:

const obj = { a: 1, b: 2, c: 3 };
fetch(‘https://api.example.com/data')
  .then(response => response.json())
  .then(data => {
    console.log(data);
    // Realizar operações com os dados recebidos
  })
  .catch(error => {
    console.error(error);
    // Lidar com o erro
  })
  .finally(() => {
    console.log(‘Fim');
    // Executar ações finais, como limpeza ou manipulação de eventos
  });

Explicação:

Neste exemplo, usamos o método fetch() para fazer uma requisição HTTP e obter alguns dados de uma API. Em seguida, encadeamos chamadas de then() para processar a resposta e lidar com erros através do método catch().

Independentemente do resultado da Promise (rejeitada, resolvida..) o código dentro do método finally() será sempre executado. 

Neste caso, estamos apenas a imprimir a mensagem de "Fim" na consola, mas a ideia é podermos realizar qualquer tipo de operação final, como limpeza ou manipulação de eventos.

3. Array.prototype.flat() e Array.prototype.flatMap():

O ES9 adicionou os métodos flat() e flatMap() à classe Array.prototype e fornecem uma maneira mais fácil de manipular arrays multidimensionais. Vamos analisar cada um deles:

Array.prototype.flat()

• O método flat() cria um novo array unidimensional, removendo qualquer aninhamento de arrays dentro do array original;
• O método flat() não altera o array original, mas retorna um novo array resultante da operação;
• Opcionalmente, o método flat() aceita um argumento depth que especifica a profundidade máxima de aninhamento que deve ser achatado. O valor padrão é 1. Se o depth não for fornecido ou for igual a 1, o método flat() removerá apenas um nível de aninhamento.

Exemplo:

const arr = [1, 2, [3, 4, [5, 6]]];
const flattened = arr.flat();
console.log(flattened); // Output: [1, 2, 3, 4, [5, 6]]

Explicação:

Neste exemplo, temos um array "arr" com dois níveis de aninhamento. Ao chamar o método flat() sem fornecer um valor para depth, o método achatou o array para um único nível, removendo o primeiro nível de aninhamento interno. O resultado é um novo array "flattened" com os elementos [1, 2, 3, 4, [5, 6]].

Array.prototype.flatMap()

• O método flatMap() combina as funcionalidades de map() e flat() em um único método. Ele mapeia cada elemento do array original para um novo valor através de uma função de callback e, em seguida, achata o resultado em um novo array;
• Assim como o map() já antigo no javascript, o método flatMap() também aceita um argumento thisArg opcional para definir o valor do this dentro da função de callback.

Exemplo:

const arr = [1, 2, 3, 4];
const mappedAndFlattened = arr.flatMap(x => [x, x * 2]);
console.log(mappedAndFlattened); // Output: [1, 2, 2, 4, 3, 6, 4, 8]

Explicação:

Neste exemplo, temos um array "arr" com os elementos [1, 2, 3, 4]. Ao chamar o método flatMap() com uma função de callback é retornado um novo array [x, x * 2] para cada elemento x, o método mapeia cada elemento do array original para um novo array e, em seguida, achata o resultado em um único nível. O resultado é um novo array "mappedAndFlattened" com os elementos [1, 2, 2, 4, 3, 6, 4, 8].

Artigos Relacionados: