Ordenar matrices en JavaScript

Facebooktwittergoogle_pluslinkedinmailFacebooktwittergoogle_pluslinkedinmail

Sí, ya se que el título no parece prometer gran cosa. Ordenar una matriz en JavaScript es un simpleza. Basta con un matriz.sort() y, hala, ya está ordenada… ¿O no?. Sí, si se trata de una matriz “normal” de JavaScript. Sabemos que JavaScript, de forma nativa, sólo gestiona matrices unidimensionales, indexadas. Son un modelo de colección de datos inherentemente simple, en el que cada dato tiene un índice que lo identifica. Estos índices son numéricos, consecutivos, empezando desde 0.

Realmente, es un modelo simple y, a la postre, insuficiente para cubrir muchas necesidades de hoy en día. Si quieres una matriz bidimensional, en realidad, lo que manejas es una matriz de matrices. Cada elemento de la matriz bidimensional es, a su vez, una simple matriz unidimensional.

Además, si quieres una matriz asociativa, al estilo de las que maneja, por ejemplo, PHP, ya tienes que recurrir a parsear un objeto JSON. Y ahora viene lo bueno. Si tienes una matriz bidimensional asociativa (creada a partir de un JSON), y quieres ordenar sus elementos por uno de los campos de forma que se mantengan las relaciones de los demás elementos, ¿cómo hacerlo? Vamos a ello.

EL ESCENARIO

Vamos a partir, para este ejemplo, de un JSON con una lista de países (para simplificarlo, vamos a poner sólo 10). De cada país tenemos los siguientes datos:

  • codigo Es un literal de dos letras, como abreviatura del nombre del país.
  • nombre Es un literal con el nombre del país.
  • seleccionado Es una variable booleana donde indicaremos si el país ha sido seleccionado, para, por ejemplo, una candidatura para JJOO, o cualquier otra cosa. Cómo solo es un ejemplo, lo dejo a tu imaginación.
  • continente Es un literal con el nombre del continente en el que está el país.

El JSON quedaría así:

Cómo ves, es, a todas luces, una matriz bidimensional con claves asociativas.

Ahora queremos ordenar todos los elementos, digamos, por el campo nombre. Pero, cómo es lógico, queremos que se mantengan las relaciones de datos entre los elementos de cada país. Es decir, Argentina, por ejemplo, tiene el código AR, no está seleccionado (valor false), y su continente es América. Y no queremos que esa relación cambie. No podemos permitir que nos quede con otro código o continente, por ejemplo.

LA SOLUCIÓN

La solución es más fácil de lo que parece. Observa el listado ordenar.htm:

Veamos lo que hacemos. En primer lugar, en la línea 13 declaramos una variable con el JSON de la lista de países que hemos comentado como ejemplo. Después, en la línea 14 convertimos ese JSON en una matriz, con JSON.parse(). Esa parte no tiene mayor misterio. Luego, mostramos la matriz en la consola de JavaScript del navegador, en la línea 15. Nos aparece algo como lo siguiente:

Ahora viene la magia. Esto es una matriz y, en la línea resaltada (la 16), le aplicamos el método multisort(). Cómo argumento, le pasamos el nombre del campo por el que queremos ordenar (en este caso es nombre, es decir, el nombre del país). En la línea 17 mostramos el resultado, que se ve así:

Hala. Ya lo tenemos resuelto… o casi. Sigue leyendo, que ya queda poco.

EL MÉTODO multisort()

Pues mira que resulta que JavaScript no hace estas cosas. El método Array.multisort() no es nativo de JavaScript. Si observas el listado anterior con más calma, verás que en la línea 11 hemos insertado un fichero llamado multisort.js, cuyo listado es el siguiente:

Lo que hacemos es crear una función que resuelve el problema, e incorporarla al objeto Array mediante el prototype de toda la vida (si no estás familiarizado con esta forma de incorporar nuevos métodos a los objetos de JavaScript puedes visitar este enlace). Lo bueno es que este fichero puedes incluirlo en tu sitio web en cualquier página que lo necesites.

Como siempre, los archivos te los puedes descargar en este enlace.

     

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *