Sort array by dates in React JS

Question

I have an array of objects as follows :

let cars = [
    {"id":20,"mileage":41300,"make":"Golf", initialRegistration:"09/02/2010"}, 
    {"id":21,"mileage":51300,"make":"Passat", initialRegistration:"06/04/2012"},
    {"id":22,"mileage":61300,"make":"Audi", initialRegistration:"02/01/2018"},
    {"id":23,"mileage":20300,"make":"Touran", initialRegistration:"17/09/2013"},
    {"id":24,"mileage":10300,"make":"Polo", initialRegistration:"26/07/2014"}
];

And I want to sort it by initialRegistration.

I tried to do it as follows :

let sortedCars = cars.sort((a, b) => Date.parse(a.initialRegistration) - Date.parse(b.initialRegistration));

let sortedCars1 = cars.sort((a, b) => new Date(a.initialRegistration) - new Date(b.initialRegistration));

let sortedCars2 = cars.sort((a, b) => new Date(a.initialRegistration).getTime() - new Date(b.initialRegistration).getTime());

But none of these attempts did not work. The results that I get is :

Golf - 09/02/2010
Passat - 06/04/2012
Audi - 02/01/2018
Touran - 17/09/2013
Polo - 26/07/2014

Here is fiddle.

Pranav C Balan · Accepted Answer · 2016-12-09 11:04:48Z

13

Use Date constructor and do something like this.

let sortedCars1 = cars.sort((a, b) => new Date(...a.initialRegistration.split('/').reverse()) - new Date(...b.initialRegistration.split('/').reverse()));

let cars = [{
  "id": 20,
  "mileage": 41300,
  "make": "Golf",
  initialRegistration: "09/02/2010"
}, {
  "id": 21,
  "mileage": 51300,
  "make": "Passat",
  initialRegistration: "06/04/2012"
}, {
  "id": 22,
  "mileage": 61300,
  "make": "Audi",
  initialRegistration: "02/01/2018"
}, {
  "id": 23,
  "mileage": 20300,
  "make": "Touran",
  initialRegistration: "17/09/2013"
}, {
  "id": 24,
  "mileage": 10300,
  "make": "Polo",
  initialRegistration: "26/07/2014"
}];

let sortedCars1 = cars.sort((a, b) => new Date(...a.initialRegistration.split('/').reverse()) - new Date(...b.initialRegistration.split('/').reverse()));

console.log(sortedCars1);

Or by string comparison using String#localeCompare after reversing the date string.

let sortedCars1 = cars.sort((a, b) =>
  a.initialRegistration.split('/').reverse().join().localeCompare(b.initialRegistration.split('/').reverse().join()));

let cars = [{
  "id": 20,
  "mileage": 41300,
  "make": "Golf",
  initialRegistration: "09/02/2010"
}, {
  "id": 21,
  "mileage": 51300,
  "make": "Passat",
  initialRegistration: "06/04/2012"
}, {
  "id": 22,
  "mileage": 61300,
  "make": "Audi",
  initialRegistration: "02/01/2018"
}, {
  "id": 23,
  "mileage": 20300,
  "make": "Touran",
  initialRegistration: "17/09/2013"
}, {
  "id": 24,
  "mileage": 10300,
  "make": "Polo",
  initialRegistration: "26/07/2014"
}];

let sortedCars1 = cars.sort((a, b) =>
  a.initialRegistration.split('/').reverse().join().localeCompare(b.initialRegistration.split('/').reverse().join()));

console.log(sortedCars1);

edited Dec 9, 2016 at 11:04

answered Dec 9, 2016 at 10:55

Pranav C Balan

115k25 gold badges172 silver badges195 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rakesh Over a year ago

how we can sort by date-time like "26/07/2014 11:30 Am" ?

Pranav C Balan Over a year ago

@rakesh use moment or some other library to parse the steng and then do the differentiation

yesIamFaded Over a year ago

.toString if you get .split is not a function Error. But it is not sorting anything for me!!!!

Vinod Louis · Accepted Answer · 2016-12-09 10:56:42Z

4

Actually the date parsing was not happening correctly new Date("09/02/2010") will not work and will assume date to be 2nd sep 2010 hence it need sto be passed as "2010-02-09" yyyy-mm-dd

  let sortedCars = cars.sort((a, b) => Date.parse(new Date(a.initialRegistration.split("/").reverse().join("-"))) - Date.parse(new Date(b.initialRegistration.split("/").reverse().join("-"))));

See this http://jsfiddle.net/jwm6k66c/1590/

answered Dec 9, 2016 at 10:56

Vinod Louis

4,9061 gold badge31 silver badges50 bronze badges

Comments

Mayank Shukla · Accepted Answer · 2016-12-09 11:04:57Z

0

Your sorting way is proper, just change the date format in cars array, make it MM:DD:YYYY, or YYYY:MM:DD it will work, because these are the formats that Date parse accept.

answered Dec 9, 2016 at 11:04

Mayank Shukla

105k19 gold badges163 silver badges146 bronze badges

Comments

Haluk · Accepted Answer · 2024-10-21 09:16:04Z

0

      let cars = [
        {"id":20,"mileage":41300,"make":"Golf", initialRegistration:"09/02/2010"}, 
        {"id":21,"mileage":51300,"make":"Passat", initialRegistration:"06/04/2012"},
        {"id":22,"mileage":61300,"make":"Audi", initialRegistration:"02/01/2018"},
        {"id":23,"mileage":20300,"make":"Touran", initialRegistration:"17/09/2013"},
        {"id":24,"mileage":10300,"make":"Polo", initialRegistration:"26/07/2014"}
      ];  
         
      const cloneCars = [...cars]
    
      const dateSort = (a, b) => {
        const dateA = new Date(a.initialRegistration)
        const dateB = new Date(b.initialRegistration)
        if (dateA > dateB) return 1;
        if (dateA < dateB) return -1;
        return 0
    }
    
    const sortedDate = cloneCars.sort(dateSort)
    console.log(sortedDate)

edited Oct 21, 2024 at 9:16

Haluk

1,5462 gold badges6 silver badges18 bronze badges

answered Oct 19, 2024 at 15:48

Gangesh Yadav

12 bronze badges

1 Comment

Haluk Over a year ago

I've added a live code snippet using your original script and seems it does not order the dates as required.

Collectives™ on Stack Overflow

Sort array by dates in React JS

4 Answers 4

3 Comments

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related