Diferentes maneiras de ordenar o array em Typescript

Neeraj Dana Segue 15 de jul · 3 min ler

O que esperar

Neste tutorial de datilografia, veremos como podemos classificar matrizes em datilografia de maneira digitada

até o final deste pequeno tutorial de datilografia, você saberá

Como o ordenamento de array funciona em transcrito
Uso do array readonly
tipo de retorno de função de classificação
classificações sensÃveis
Função comparador

Como o ordenamento de array funciona em transcrito

Vamos ver como podemos classificar uma matriz em datilografia. Suponha que tenhamos um array arr mencionado abaixo, e eu quero classificá-lo. A maneira mais fácil é a função [] .sort.

 arr = ['vue', 'angular', 'reagir'] 
console.log (arr.sort ())
//resultado
// ['angular', 'reagir', 'vue']

Tipo de retorno de função de classificação

Portanto, a parte surpreendente é que a função de classificação realmente manipulou nossa matriz original. Não retorna um novo array. Em vez disso, ele reordena nossa matriz original.

Uso De ReadOnly

Vamos dar uma olhada no resultado novamente e tentar registrar o array original.

 arr = ['vue', 'angular', 'reagir'] 
console.log (arr.sort ())
console.log (arr)
//resultado
// ['angular', 'reagir', 'vue']
// ['angular', 'reagir', 'vue']

Às vezes, na verdade, não queremos manipular o array original. Em vez disso, queremos que ele retorne uma nova matriz e é aí que dividimos a matriz antes da função de classificação.

 deixe newarr = arr.slice (). sort (); 
console.log ({... arr})
console.log ({... newarr})
//resultado
// ['vue', 'angular', 'Reagir']
// ['React', 'angular', 'vue']

Outra maneira de evitar manipular o array original é usar matrizes readonly. Arrays somente leitura entrarão em ação se marcarmos nossa matriz como somente leitura. Não podemos chamar as funções que podem manipulá-las depois desse ponto.

 let arr: ReadonlyArray <string> = ['vue', 'angular', 'Reagir']; 
deixe newarr = arr.slice (). sort ();
console.log ({... arr})
console.log ({... newarr})
//resultado
// ['vue', 'angular', 'Reagir']
// ['React', 'angular', 'vue']

Classificadores sensíveis a maiúsculas

Quando chamamos a função de classificação, estamos classificando a matriz em ordem alfabética. No entanto, o método padrão de classificação diferencia maiúsculas de minúsculas. Isso significa que primeiro classifica alfabeticamente todas as letras maiúsculas [AZ], e somente depois disso, classifica as letras minúsculas [az]. Podemos ver isso no exemplo acima. Embora 'a' venha antes de 'R', a ordenação da nova matriz começa com 'React', já que é capitalizada e é seguida por ' angular ' e 'vue'. Isso é algo para se ter em mente, se quisermos classificar a lista em ordem alfabética. Pode valer a pena converter todos os caracteres em uma string para minúsculas primeiro.

Função comparadora na função sort

Agora, o código acima funcionará se os tipos de elementos da matriz forem sequências. Mas para objetos complexos, há uma abordagem diferente. Digamos que temos uma matriz de objetos e queremos classificar em uma propriedade específica. Então, nesse caso, teremos que passar um parâmetro para a função sort que é uma função que aceita duas coisas. O primeiro é o primeiro valor da matriz e o próximo é o próximo valor nessa matriz e, em seguida, podemos retornar a [specificproperty] – b. [Specificproperty]. Vamos um exemplo disso:

 deixe arr = [{ 
nome: 'jhon', ano: 1990
}
{
nome: 'kasey', ano: 1985
}
{
nome: 'jhony', ano: 1980
}
{
nome: 'lírio', ano: 1975
}]


arr.sort ((a, b) => {
retorno a.ano - b.ano
})

Resumo

A função sort de matrizes reorganiza o array e retorna o mesmo array. Não retorna um novo array. É sensível a maiúsculas e minúsculas, portanto, as letras maiúsculas serão classificadas antes das letras minúsculas. Para objetos complexos, precisamos passar um método comparador no qual podemos classificar a matriz por uma propriedade específica.