Ordenar un array de enteros en JavaScript

Pablo Felipe 12 octubre 2023
  1. Ordenar un array de enteros en JavaScript usando el método .sort
  2. Pasar una función de comparación como parámetro
  3. Ordenar un array de enteros en JavaScript usando la función de flecha
Ordenar un array de enteros en JavaScript

Al presentar el método .sort que se puede usar para ordenar un array por un orden específico, este tutorial tiene el propósito de explicar por qué este método necesita una función de comparación si desea ordenar correctamente un array de números enteros.

Esta función de comparación dictará el orden de clasificación. Además, explicaremos cómo usarlo para hacer una clasificación en orden descendente, además de una forma más corta de usarlo todo junto, utilizando la función de comparación como una función de flecha dentro del método .sort.

Ordenar un array de enteros en JavaScript usando el método .sort

El método .sort es un método de la entidad Array que devuelve un array ordenada a partir del array a la que se llamó originalmente este método. Por ejemplo:

// Input
let array = [10, 10000, 1000, 100, 1]
console.log(array.sort())

Producción :

// Output
[ 1, 10, 100, 1000, 10000 ]

Claro, esto es de esperar ya que el método .sort ordenal array. Pero, si tenemos la siguiente entrada:

// Input
let array = [12900, 877, 12, 992, 10000]
console.log(array.sort())

Tenemos un pedido incorrecto como este:

// Output
[10000, 12, 12900, 877, 992]

Sucede porque el orden predeterminado de .sort se basa en UTF-16 o Formato de transformación de unidades de 16 bits, que es una codificación del patrón Unicode. El método convierte los valores del array en el tipo de cadena y luego ordena sus valores Unicode.

Con esto explicado, el método .sort también se puede usar para ordenar otros tipos de datos, no solo números.

Pero, ¿cómo se puede usar el método .sort para ordenar un array correctamente? Es simple: mediante el uso de una función de comparación.

Pasar una función de comparación como parámetro

Como el método .sort se puede utilizar sin ningún parámetro, una función de comparación es opcional. Básicamente, esta función define la ordenación del método .sort, y esta función recibe dos parámetros: el primer elemento a comparar y el segundo elemento a comparar.

El método .sort:

  • Ponga first después de second si la compareFunction devuelve un valor mayor que 0;
  • Poner first antes de second si compareFunction devuelve un valor inferior a 0;
  • No hacer nada si la compareFunction devuelve un valor igual a 0.

Entonces, con la compareFunction(first, second), podemos dictar el orden de clasificación pasando una operación entre los parámetros first y second. En orden ascendente,

// Ascending ordering
function compareFunction(first, second) {
  if (first > second)
    return 1  // 1 is greater than 0, so .sort will put first after second.
    if (first < second) return -1  // -1 is less than 0, so .sort will put first
                                   // before second.
    return 0
}

Y para orden descendente, podemos invertir los operadores.

// Descending ordering
function compareFunction(first, second) {
  if (first < second)
    return 1  // 1 is greater than 0, so .sort will put first after second.
    if (first > second) return -1  // -1 is less than 0, so .sort will put first
                                   // before second.
    return 0
}

Ahora, poniendo compareFunction para ordenación ascendente junto con el método .sort, finalmente, tenemos:

// Input:
let array = [12900, 877, 12, 992, 10000]
// Ascending
array.sort(function compareFunction(first, second) {
  if (first > second)
    return 1  // 1 is greater than 0, so .sort will put first before second.
    if (first < second) return -1  // -1 is less than 0, so .sort will put first
                                   // after second.
    return 0
})
console.log(array)

Producción :

// Output:
[ 12, 877, 992, 10000, 12900 ]

Ordenar un array de enteros en JavaScript usando la función de flecha

También podemos reducir todo el bloque de código a una sintaxis mínima, utilizando funciones de flecha.

Una función de flecha es otra forma de usar una función con una sintaxis más corta. Las funciones de flecha son funciones anónimas, y esto significa que no tienen nombre (se almacenan en variables o se pasan como parámetros de función) y no se pueden usar en todas las situaciones.

Con la estructura de una función de flecha, las funciones tradicionales se pueden transformar en un bloque más corto, como el ejemplo:

// Common anonymous function
function(x) {
  return x + 1;
}

// Arrow function
(x) => x + 1

Además de eso, la estructura de una función de flecha puede devolver automáticamente el valor de la expresión sin la palabra reservada return:

// Arrow function
let arrowFunction = (x) => x + 1
console.log(arrowFunction(1))

Producción :

//Output
2

El console.log() imprime el valor de 1 + 1, es decir, 2, aunque arrowFunction no utiliza la instrucción return. Nos ayudará en el siguiente paso.

Como se dijo, el método .sort puede tener una función de comparación dentro de él, y esta función puede ser una función de flecha. Convirtiendo la estructura de la función de comparación anterior, podemos transformar todo ese bloque de código en un bloque más corto como se muestra a continuación:

// Input:
let array = [10000, 10, 100, 1000, 1]
array.sort((first, second) => {
  if (first > second) return 1
    return -1
})
// Ascending: If first > second == true, then change one by the other.
console.log(array)

Podemos cambiar la condición a first < second y, en su lugar, devolver un valor -1 por defecto si la condición principal no es el caso; dado que el valor 0 al método .sort es a valores iguales y de esta forma se pueden cambiar de posición sin interferir en el resultado final. De esta forma, podemos reducir aún más, como en el siguiente ejemplo:

// Input:
let array = [10000, 10, 100, 1000, 1]
array.sort((first, second) => first > second ? 1 : -1)
// Ascending: If first > second == true, then change one by the other.
console.log(array)

Mire que la comparación > anterior y el return predeterminado se cambiaron a una sola comparación: first > second ? 1 : -1. Significa que si la comparación es true, devuelve 1; si no, devuelve -1.

Necesitamos el ? operador ternario porque la comparación primero > segundo solo da como resultado true o false. Pero como se dijo, el método .sort espera 1, -1 o 0.

Producción :

// Output:
[ 1, 10, 100, 1000, 10000 ]

Y por orden descendente:

// Input:
let array = [10000, 10, 100, 1000, 1]
array.sort((first, second) => first < second ? 1 : -1)
// Descending: If first < second == true, then change one by the other.
console.log(array)

Producción :

// Output:
[ 10000, 1000, 100, 10, 1 ]

Otra forma de hacer lo mismo es usando el operador ternario - para la resta. Cuando usamos array.sort((first, second) => first > second ? 1 : -1), si first - second da como resultado un valor mayor que 0, entonces habrá un índice que cambiará entre sí. Si first - second da como resultado un valor inferior a 0, no pasará nada, y para valores iguales, la comparación devolverá 0.

Ejemplo:

// Input:
let array = [10000, 10, 100, 1000, 1]
console.log(array.sort((first, second) => first - second))

Producción :

// Output:
[ 1, 10, 100, 1000, 10000 ]

¿Qué podemos hacer en orden descendente? No, no es cambiar el operador ternario - a + porque cada número positivo más otro número positivo dan como resultado un valor mayor a 0. Pero tenemos una solución simple a esto: invertir el first - second a second - first.

De esta forma, si second - first da como resultado un valor mayor que 0, entonces el método .sort cambiará sus posiciones entre sí.

Ejemplo:

// Input:
let array = [10000, 10, 100, 1000, 1]
console.log(array.sort((first, second) => second - first))

Producción :

// Output:
[ 10000, 1000, 100, 10, 1 ]

Artículo relacionado - JavaScript Array