0

Tengo un arreglo de objetos muy simple, algo como esto:

let profiles = [
  {
    'title': 'X',
    'url' : 'https://google.com',
    'description': 'Lorem'
  },
  {
    'title': 'Y',
    'description': 'Ipsum'
  }
];

Cada objeto tiene las propiedades title y description, pero tiene de manera opcional url.

Hago un sort al arreglo para ordenarlo en orden alfabético según el title.

profiles.sort( (a, b) => {
  return a.title.toLowerCase() > b.title.toLowerCase();
});

Y al final inserto los datos del arreglo en el HTML con un forEach:

profiles.forEach( (profile) => {
  let element = `<tr><td>${profile.title}</td><td>${profile.description}</td></tr>`;
  if ( profile.url !== undefined ) {
    element = `<tr><td>${profile.title}</td><td><a href="${profile.url}" target="_blank">${profile.description}</a></td></tr>`;
  }
  document.getElementsByTagName('tbody')[0].insertAdjacentHTML('beforeend', element);
});

Esto funciona bien, el problema es que cuando llego a los 11 elementos del arreglo no lo ordena correctamente. Ejemplo:

Debería obtener esto:

Age
Digimon
Github
Hobbies
Job
MAL
Name
OS
Steam
Twitter
Type

Pero obtengo esto:

Job
OS
Github
Digimon
Name
MAL
Hobbies
Age
Steam
Twitter
Type

Hasta ahora he intentado meter tanto la declaración del arreglo como el sort dentro de una función que retorna una promesa, para después utilizar el then de esa promesa y así insertar en el HTML, pero funcionó exactamente igual. Se veía algo así:

let ordenar = () => {
  return new Promise( (resolve, reject) => {

    let profiles = [
      {..},{..}
    ];

    profiles.sort( (a, b) => {
      return a.title.toLowerCase() > b.title.toLowerCase();
    });

    resolve(profiles);

  });
}

ordenar().then(resp => {
  resp.forEach( (profile) => {
    ....
  });
}).catch();

2 respuestas 2

2

La función sort de los arrays no espera un boolean en la comparación, si no un -1, 0 ó 1.

La documentación oficial dice que tiene que ser así o si no especifica lo siguiente: Si se retornan resultados inconsistentes entonces el orden de ordenamiento es indefinido.

Tendrás que hacer la función sort con una comparación del tipo:

profiles.sort(function (a, b) {
  if (a.title > b.title) {
    return 1;
  }
  if (a.title < b.title) {
    return -1;
  }

  return 0;
});
1
  • Muchas gracias.
    – akko
    Commented el 17 ago. 2018 a las 6:37
0

Solo quería agregar que para ordenar también caracteres especiales, como los acentos y las eñes, comunes en español, podemos usar localCompare y pasar los flags de 'es' (español) y {sensitivity: 'base'} que hace que á == a por ejémplo.

let profiles = [{'title': 'Az'},{'title': 'Áb'},{'title': 'ay'},{'title': 'Ña'},{'title': 'Nz'},{'title': 'ny'}];


profiles.sort((a, b) => a.title.localeCompare(b.title, 'es', {sensitivity: 'base'}))


console.log(profiles)

Algunos navegadores o motores de JavaScript pueden no aceptarlo, o tener bugs. Por ejemplo nodejs v8.11.4 lo soporta pero no lo ejecuta, osea que seguramente sea un bug de esa versión de V8.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.