Como pegar o valor do último elemento do array JavaScript

Neste artigo você vai aprender a como pegar o valor do último elemento do array em JavaScript, de uma maneira super simples!

Pra pegar o valor do último elemento de um array em JavaScript existem dois caminhos diretos:

arr.at(-1), método da especificação ECMAScript 2022 que aceita índice negativo e conta a partir do fim do array

console.log(arr.at(-1)); // 5

Os dois devolvem o mesmo valor, e o at() devolve undefined quando o índice fica fora do intervalo, como num array vazio

Fala programador(a), beleza? Bora aprender mais sobre arrays e também sobre a linguagem JavaScript!

É importante que haja um recurso de fácil acesso para o último elemento do array, pois eles quase sempre variam de tamanho

E é comum precisar acessar o último índice, sem saber quantos elementos um array possui

Em JavaScript podemos utilizar em conjunto a propriedade length do array e o valor -1

Isso nos dará o último elemento de qualquer array

Pois length dá a quantidade total de elementos, mas como o índice começa a contar do 0, precisamos deduzir o valor de 1

Veja um exemplo prático:

var arr = [1, 2, 3, 4, 5];

console.log(arr[arr.length - 1]); // 5

Veja que utilizamos a notação de array para acessar o elemento, que são os colchetes

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 114 aulas
• 4 projetos
• 9h 18min

Conhecer formação

Dentro deles foi a vez da propriedade length e o -1, que acabam trazendo 5

O número 5 é o último elemento do array arr, nossa variável criada na primeira linha

E desta forma o array pode ter qualquer quantidade de elementos, que conseguimos achar o seu último, legal né? 😀

Conclusão

Neste artigo você aprendeu a como pegar o valor do último elemento do array em JavaScript

Utilizamos a combinação da propriedade length, que dá a quantidade de números de um array

Junto do valor -1, ou seja, a quantidade total menos 1 é o número do último índice

Isso acontece pois o array começa a contar em 0, que é o primeiro elemento/índice

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!

E com arr.at(-1)? A forma moderna:

O length – 1 funciona em qualquer lugar, mas ele te obriga a escrever o nome do array duas vezes na mesma linha

Aí veio o método at(), que faz parte da especificação ECMAScript 2022 (ES13), vinda da proposta TC39 "Relative Indexing Method"

A sacada dele é aceitar índice negativo: quando o índice é menor que zero, o acesso equivale a index + array.length

Ou seja, at(-1) devolve o último elemento, at(-2) o penúltimo, e por aí vai

console.log(arr.at(-1)); // 5 console.log(arr.at(-2)); // 4

Muito mais limpo de ler, né? 😀

Curiosidade de bastidor: a proposta original chamava esse método de .item(), e o nome foi trocado pra .at() porque .item() não era web compatible

arr.at(-1) funciona em qual navegador e em qual runtime?

Essa é a pergunta que trava a maioria na hora de usar

O Array.prototype.at() está com status Baseline "Widely available" na MDN, disponível em todos os navegadores desde março de 2022

As versões mínimas são:

Chrome 92

Firefox 90

Safari 15.4

Edge e Opera acompanham o Chromium

No servidor a história é a mesma:

Node.js 16.6.0

Deno 1.12

Bun 1.0.0

Então se o teu projeto roda em navegador atualizado ou em Node recente, pode usar sem medo

E se o array estiver vazio?

Tome cuidado aqui, porque é onde muita gente se ferra

O at() retorna undefined quando o índice fica fora do intervalo do array

Isso vale tanto pra índice menor que o comprimento negativo do array quanto pra índice maior ou igual ao comprimento, e ele nem tenta acessar a propriedade correspondente

console.log(vazio.at(-1)); // undefined

O detalhe prático: se você já sai encadeando algo no resultado, tipo .toUpperCase(), o erro estoura ali

Então sempre confere o retorno antes de usar, principalmente quando o array vem de uma API

E se eu quiser o último elemento que atende uma condição?

Aí o at(-1) não resolve, porque ele pega o último de qualquer jeito

Pra isso existem o findLast() e o findLastIndex(), padronizados no ECMAScript 2023 (a proposta chegou ao Stage 4 em 06/06/2022 e o padrão ES2023 foi publicado em 27/06/2023)

O findLast() percorre o array do fim pro começo, chamando o predicado em ordem decrescente de índice, e devolve o primeiro elemento que satisfaz a condição

Se nenhuma chamada retornar valor verdadeiro, ele devolve undefined

Já o findLastIndex() devolve o índice, ou -1 quando não acha nada

console.log(arr.findLast(n => n % 2 === 0)); // 4 console.log(arr.findLastIndex(n => n % 2 === 0)); // 3

Suporte também é tranquilo: Baseline "Widely available", disponível em todos os navegadores desde agosto de 2022, com Chrome 97+, Firefox 104+, Safari 15.4+ e Node.js 18+

Perguntas frequentes sobre pegar o último elemento do array

(usar aqui o bloco de FAQ com as perguntas e respostas do campo geo.faq)

Eu já gravei um vídeo aqui do canal mostrando como mudar a posição de um elemento dentro do array com splice, e sempre cai a mesma dúvida nos comentários: a contagem do índice

O array começa a contar do 0, então o "quarto elemento" mora no índice 3, e é aí que a galera erra a mão

É o mesmo motivo pelo qual o length – 1 confunde tanto quem tá começando

O at(-1) resolve justamente essa parte, porque tu fala em posição a partir do fim e não em aritmética de índice

Pra fechar de vez essa comparação faltaria rodar os três jeitos lado a lado (length – 1, at(-1) e a versão com slice) em navegador e em Node, medindo tempo em array grande, e mostrar o resultado com o print da medição

Sem essa medição feita, não dá pra afirmar qual é mais rápido, só qual é mais legível