O método sort() do Array JavaScript

Aprenda como usar o método sort() para ordenar arrays de números, strings e objetos.

Ricardo Reis
7 min readMay 25, 2020

--

English version: https://www.javascripttutorial.net/javascript-array-sort/

O método sort() permite classificar (ordenar) elementos de um array local. Além de retornar o array ordenado, o método sort() altera as posições dos elementos no array original.

Neste tutorial você vai encontrar:

  • Entendendo o método sort().
  • Ordenando um array de strings.
  • Classificando um array de strings com caracteres não ASCII.
  • Ordenando um array de números.
  • Ordenando um array de objetos por uma propriedade específica.
  • Ordenando objetos por uma propriedade numérica.
  • Ordenando objetos por uma propriedade string.
  • Ordenando objetos por uma propriedade date.
  • Otimizando o método sort().

Entendendo o método sort()

Por padrão, o método sort() classifica os elementos do array em ordem crescente, com o menor valor primeiro e o maior por último.

O método sort() molda os elementos em strings e compara as strings para determinar as suas ordens.

Considere o seguinte exemplo:

Resultado:

Neste exemplo, o método sort() coloca 10 antes de 2porque a string '10' vem antes da string '2' ao fazer uma comparação entre as strings.

Para corrigir essa interpretação você precisa passar uma função de comparação para o método sort(). O método sort() usará a função de comparação para determinar as ordens dos elementos.

Confira a sintaxe do método sort():

O método sort() aceita um argumento opcional, que é uma função que compara dois elementos do array.

Se você omitir a função de comparação, o método sort() classificará os elementos com a ordem de classificação com base nos valores dos pontos de código Unicode dos elementos (como se fossem strings), conforme mencionado anteriormente.

A função de comparação do método sort() aceita dois argumentos e retorna um valor que determina a ordem de classificação. A seguir veremos a sintaxe da função de comparação:

A função compare() aceita dos argumentos, o a e o b. O método sort() classificará os elementos com base no valor de retorno da função compare() seguindo as seguintes regras:

  1. Se compare(a, b) for menor que zero, o método sort() classifica a para um índice menor que b. Ou seja, o a virá antes de b.
  2. Se compare(a, b) for maior que zero, o método sort() classificará b com um índice menor que a, ou seja, b virá primeiro.
  3. Se compare(a, b) retornar zero, o método sort() considera a igual a b e deixa suas posições inalteradas.

Para corrigir o problema de ordenação de números, você pode usar a seguinte sintaxe:

Resultado:

Ou você pode definir a função de comparação usando a sintaxe de arrow function:

E a forma seguinte é mais simples, pois os elementos do array são números:

Ordenando um array de strings

Suponha que você tenha um array de strings denominado animals da seguinte forma:

Para ordenar os elementos em ordem alfabética crescente, use o método sort() sem passar a função de comparação, conforme a seguir:

Resultado:

Para classificar o array animals em ordem alfabética decrescente, é necessário altera a lógica da função de comparação e passá-la para o método sort() como no exemplo a seguir:

Resultado:

Suponha que você tenha um array com elementos em letras maiúsculas e minúsculas, como a seguir:

Para ordenar esse array em ordem alfabética, você precisa usar uma função de comparação personalizada para converter todos os elementos para o mesmo tipo de letra, maiúscula ou minúscula e passar essa função para o método sort().

Resultado:

Classificando um array de strings com caracteres não ASCII

O método sort() está funcionando bem com as strings em caracteres ASCII. No entanto para as strings com caracteres não ASCII, como è ou é, o método shot() não funcionará corretamente. Por exemplo:

Resultado:

Como você vê, a string écureuil deve vir antes da string zèbre.

Para resolver isso, use o método localeCompare() do objeto String para comparar sequencias de caracteres em uma localidade específica, assim:

Resultado:

Os elementos do array animaux agora estão em ordem correta.

Ordenando um array de números

Suponha que você tenha uma array de números denominados scores, como no exemplo a seguir:

Para classificar um array de números em ordem numérica, você precisa passar para o método sort() uma função de comparação personalizada que compara dois números.

O exemplo a seguir ordena o array scores numericamente em ordem crescente.

Resultado:

Para classificar um array de números em ordem numérica decrescente, basta inverter a lógica na função de comparação, conforme mostrado no exemplo a seguir:

Resultado:

Ordenando um array de objetos por uma propriedade específica

A seguir é apresentado um array de objetos de employee em que cada objeto contém 3 propriedades: name, salary e hireDate.

Ordenando objetos por uma propriedade numérica

O exemplo a seguir mostra como ordenar os funcionários por valor de salário em ordem crescente.

Resultado:

Este exemplo é semelhante ao exemplo de ordenação de um array de números em ordem crescente. A diferença é que ele compara a propriedade salary de dois objetos.

Ordenando objetos por uma propriedade string

Para ordenar o array de employees pela propriedade name, sem distinção entre letras maiúsculas e minúsculas, você passa a função de comparação transformando todas as letras das strings em maiúsculas antes de efetuar a comparação, da seguinte forma:

Resultado:

Ordenando objetos pela propriedade “date”

Suponha que você queira ordenar os funcionários com base na data de contratação. Os dados da data de contratação de cada funcionário estão armazenados na propriedade hireDate, porém é apenas uma string que representa uma data, não é exatamente um objeto Date. Portanto, para ordenar os funcionários por data de contratação, primeiro é necessário criar um objeto Date válido a partir da string hireDate e só então comparar as datas, da mesma forma que comparamos números.

Aqui está a solução:

Otimizando o método sort()

De fato, o método sort() chama a função de comparação várias vezes para cada elemento do array.

Veja o exemplo a seguir:

Resultado:

Entenda como esse código é interpretado:

  1. Primeiro, declare um array rivers com nomes de rios:
  2. Segundo, ordene os elementos do array pelo comprimento dos nomes dos rios usando o método sort(). Reproduzimos os elementos no console sempre que o método sort() chama a função de comparação.

Como mostrado no resultado acima, cada elemento foi avaliado várias vezes.

Se os números de elementos do array aumentar, também vai diminuir o desempenho do código.

Você não pode reduzir o número de vezes que a função de comparação é executada. No entanto, você pode reduzir o trabalho que a comparação precisa fazer. Essa técnica é chamada Transformação Schwrtziana.

Para implementar essa técnica siga estas etapas:

  1. Primeiro, extraia os valores reais em um array temporário usando o método map().
  2. Segundo, ordene o array temporário com os elementos que já foram validados (ou transformados).
  3. Terceiro, percorra o array temporário para obter um array com ordem correta.

Aqui está a solução:

Resultado:

Neste tutorial você aprendeu como usar o método sort() do Array JavaScript para ordenar arrays de string, números, datas e objetos.

Veja o índice de todos os tutoriais JavaScript

--

--