🧙♂️ Todas as novas funcionalidades do Javascript desde 2016 até 2025
Mago Acadêmico
Posted on November 30, 2024
O Javascript evoluiu bastante com o passar do tempo e nem todo mundo sabe como funcionam os métodos mais recentes da linguagem, portanto fiz um compilado simplificado explicando a maioria dos métodos e funcionalidades lançados desde 2016 até 2025.
Não coloquei funcionalidades que são mais complexas, como promises ou mudanças no regex, mas veja o link da fonte caso você queira mais detalhes
array.includes
: Este método permite verificar se um array contém um determinado elemento. É muito bom para elementos do tiponumber
estring
, mas tome cuidado ao verificar objetos, pois ele irá verificar por referência e não se o objeto contém as mesmas propriedadesOperador de exponenciação (`
)**: Este operador é usado para calcular a potência de um número, substituindo a necessidade de usar o método
Math.pow. E se você está se quanto é zero elevado a zero (
0 ** 0`), sim, é 1.Object.values
eObject.entries
:Object.values
retorna um array com os valores das propriedades enumeráveis de um objeto.Object.entries
retorna um array de pares[chave, valor]
das propriedades enumeráveis de um objeto. Esses métodos são úteis quando você usa em conjunto com métodos de array, comoArray.map
ouArray.filter
.string.{padStart,padEnd}
: Esses métodos permitem preencher uma string no início ou no final com um caractere especificado, até que a string atinja o comprimento desejado.Vírgulas finais em listas de parâmetros e chamadas de função: Permite adicionar uma vírgula após o último parâmetro de uma função ou argumento em uma chamada de função. Isso faz com que na hora de editar um código, você só mude uma unica linha, criando menos edições no código e permitindo que o git blame mostre a pessoa certa.
Spread Operator
...
: Você pode usar o operador...
para passar todas as propriedades de um objeto para outro. Você tambem pode usar isso com arrays, passando todos os elementos de um array para o outro, mas tome cuidado para não juntar um objeto com um array, pois dará erro.Object.fromEntries
: Este método é o inverso deObject.entries
, permitindo criar um objeto a partir de uma lista de pares[chave, valor]
.string.{trimStart,trimEnd}
: Estes métodos permitem remover espaços em branco do início (trimStart
) ou do final (trimEnd
) de uma string.array.{flat,flatMap}
:flat
achata arrays dentro de arrays, podendo diminuir o número das dimensões de uma matrix. Por exemplo, você pode transformar uma matrix de 2 dimensões em um array (uma dimensão)string.matchAll
: Este método retorna todas as correspondências de uma expressão regular em uma string. A vantagem desse método é que ele retorna um iterator e você pode computar o regex dentro de um loop e só executar o que for necessário.BigInt
: Introduz o tipo de dadoBigInt
, que permite representar e operar em números inteiros muito grandes, além do limite dos números inteiros tradicionais (Number
). Para representar umBitInt
, basta colocar umn
depois do número. Por exemplo123n
. Mas tome cuidado ao compararBigInt
s com número "normais", pois você precisará converter os números.Encadeamento opcional (
Optional Chaining
): Este operador (?.
) permite acessar propriedades profundamente aninhadas em objetos sem precisar verificar manualmente se cada referência no caminho énull
ouundefined
.Operador de coalescência nula (
??
): Este operador retorna o valor à direita se o valor à esquerda fornull
ouundefined
, permitindo um fallback mais seguro.string.replaceAll
: Este método substitui todas as ocorrências de uma string ou expressão regular em uma string por outra string, sem precisar usar o flagg
manualmente.Operadores de atribuição lógica: Combina operadores lógicos (
&&
,||
,??
) com atribuição, permitindo expressões mais curtas e legíveis para certas operações lógicas.Separador numérico
_
: Que numero é esse 100000000? É dificil de falar o nome do numero e ver quantas casas decimais ele tem imediatamente, mas você pode usar um separador numerico (_
) para separar dígitos do número, tornando-os mais legíveis sem afetar seu valor. Por exemplo 100_000_000 ficaria muito mais facil de entender. Lembrando que pode ser qualquer quantidade de casas, por exemplo 1_0_0_0_0_0, que é estranho, mas funciona.array.at()
: Este método fornece uma maneira de acessar elementos de arrays e strings usando índices positivos ou negativos, fazendo com que acessar o ultimo index do array seja muito mais facil. Basta passar.at(-1)
.Object.groupBy
eMap.groupBy
: Permite agrupar valores de um array baseado no valor retornado por uma função.Object.groupBy
retorna um objeto eMap.groupBy
retorna umMap
.Novos métodos da classe
Set
: Para explicar esses novos métodos eu achei muito mais fácil você ver os Vens Diagrams da própria documentação: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set_composition
- Para ver a lista completa: https://github.com/tc39/proposals/blob/HEAD/finished-proposals.md
- Se você prefere consumir esse conteúdo em video e com códigos de exemplo, veja em https://youtu.be/7ZRLIztfD6U
Posted on November 30, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 30, 2024