Tengo una serie de objetos como este:
[ {name: 'John Smith', date: '10:30 AM'}, {name: 'Jo Smith', date: '8:30 AM'}, {name: 'Ela Smith', date: '1:00 PM'}, {name: 'Dave Smith', date: '12:30 PM'}, {name: 'Elton Smith', date: '10:30 PM'} ] Me gustaría ordenarlos de más antiguo a más reciente usando dayjs() que es lo que estamos usando para el resto de nuestro proyecto, así que tengo que seguir con eso.
Por el momento estoy tratando de usar esta función así:
dayjs.extend(isSameOrBefore); dayjs.extend(customParseFormat); const sortTime = (users) => { return shifts.sort((a, b) => dayjs(a.date, 'h:mm A').isSameOrBefore(dayjs(b.date, 'h:mm A')) ? 1 : -1 ); };Me gustaría que la matriz se ordenara así:
[ {name: 'Jo Smith', date: '8:30 AM'}, {name: 'John Smith', date: '10:30 AM'}, {name: 'Elton Smith', date: '10:30 AM'}, {name: 'Dave Smith', date: '12:30 PM'}, {name: 'Ela Smith', date: '1:00 PM'} ]Sin embargo, por alguna extraña razón, se ordena así:
[ {name: 'Jo Smith', date: '8:30 AM'}, {name: 'Ela Smith', date: '1:00 PM'}, {name: 'John Smith', date: '10:30 AM'}, {name: 'Dave Smith', date: '12:30 PM'}, {name: 'Elton Smith', date: '10:30 AM'}, ]¿Alguna idea de por qué y cómo puedo solucionar esto?
Puede lograr el resultado utilizando la función de comparación de paso para ordenar el método como
const arr = [ { name: "John Smith", date: "10:30 AM" }, { name: "Jo Smith", date: "8:30 AM" }, { name: "Ela Smith", date: "1:00 PM" }, { name: "Dave Smith", date: "12:30 PM" }, { name: "Elton Smith", date: "10:30 PM" }, ]; const convertTime12to24 = (time12h) => { let [hours, minutes, modifier] = time12h.split(/\W+/); if (hours === "12") hours = "00"; if (modifier === "PM") hours = parseInt(hours, 10) + 12; return [hours, minutes]; }; const result = arr.sort((a, b) => { const [h1, m1] = convertTime12to24(a.date); const [h2, m2] = convertTime12to24(b.date); return h1 - h2 || m1 - m2; }); console.log(result); /* This is not a part of answer. It is just to give the output fill height. So IGNORE IT */ .as-console-wrapper { max-height: 100% !important; top: 0; }