Filter an array of objects by date that > than date.now

Question

I'm having some problems with arrow functions and filtering array of objects by value of date.

I've tried to filter it but it returns full array, and did'nt working as it must be.

in the end i've got to return items - objects in array which expiration date is bigger than today. It must be arrow function

const menuItems = [{
    name: 'Hamburger',
    expirationDate: '09-24-2019'
  },
  {
    name: 'Chicken',
    expirationDate: '10-03-2019'
  },
  {
    name: 'Hot-Dog',
    expirationDate: '03-24-2019'
  },
];

let today = new Date();
let dd = today.getDate();
let mm = today.getMonth();
let yyyy = today.getFullYear();
if (dd < 10) {
  dd = '0' + dd;
}

if (mm < 10) {
  mm = '0' + mm;
}
today = mm + '-' + dd + '-' + yyyy;

console.log(today);

const filterByExpiration = (items) => {
  menuItems.filter(function() {
    return items.expirationDate > today;
  })
};

You're comparing strings and expecting the JS engine to understand that you want them to be viewed as date objects. Consider using a library for these types of comparisons: https://date-fns.org/v1.9.0/docs/isAfter — lux, Jun 25 '19 at 21:19

score 0 · Answer 1 · answered Jun 25 '19 at 21:33

That's doing lexicographical comparison - not what you want. Just compare the two Dates together - and using an arrow function means you can also have an implicit return

const menuItems = [{name:'Hamburger',expirationDate:'09-24-2019'},{name:'Pizza',expirationDate:'03-11-2019'},{name:'Sushi',expirationDate:'03-21-2019'},{name:'Chicken',expirationDate:'10-03-2019'},{name:'Steak',expirationDate:'05-27-2019'},{name:'Hot-Dog',expirationDate:'03-24-2019'}];
const today = new Date();
const filterByExpiration = arr => arr.filter(({ expirationDate }) => new Date(expirationDate.replace(/-/g, "/")) > today);
console.log(filterByExpiration(menuItems));

.as-console-wrapper { max-height: 100% !important; top: auto; }

The replace is to make the date strings into valid dates - not all browsers support hyphenated dates.

Destructuring is a nice touch, but not immediately obvious. Maybe you could add a footnote ? — msg, Jun 25 '19 at 22:07
Using the built–in date parser is not a good idea, especially for formats not supported by ECMA-262. — RobG, Jun 26 '19 at 01:33

Jamal Abo · Answer 2 · 2019-06-26T07:09:01.817

-1

const menuItems = [
  {
    name: 'Hamburger',
    expirationDate: '09-24-2019'
  },
  {
    name: 'Pizza',
    expirationDate: '03-11-2019'
  },
  {
    name: 'Sushi',
    expirationDate: '03-21-2019'
  },
  {
    name: 'Chicken',
    expirationDate: '10-03-2019'
  },
  {
    name: 'Steak',
    expirationDate: '05-27-2019'
  },
  {
    name: 'Hot-Dog',
    expirationDate: '03-24-2019'
  },
];


const filterByExpiration = () => {
  const Today = Date.now()
  return menuItems.filter(function (item) {
    return new Date(item.expirationDate).getTime() > Today;
  });
};

filterByExpiration();

For Older Browsers

var filterByExpiration = () => {
  var Today = new Date(); 
  return menuItems.filter(function (item) {
    var year = Today.getFullYear();
    var month = Today.getMonth()+1;
    var day = Today.getDay();
    var dateYearArray = item.expirationDate.split('-');
    var dateYear = dateYearArray[2];
    var dateMonth = dateYearArray[0];
    var dateDay = dateYearArray[1];
    var isYear = year > dateYear;
    var isMonth = month > dateMonth;
    var isDay = day > dateDay;
    return !(isYear || isMonth || isDay);
  });
};


filterByExpiration();

edited Jun 26 '19 at 07:09

answered Jun 25 '19 at 21:23

Jamal Abo

472
4
16

This does not work in some browsers. See [What are valid Date Time Strings in JavaScript](https://stackoverflow.com/questions/51715259/what-are-valid-date-time-strings-in-javascript)? – str Jun 25 '19 at 21:24
@str what exactly does not work in the edited code? – Jamal Abo Jun 25 '19 at 21:27
`new Date('09-24-2019')` => `Invalid Date` – str Jun 25 '19 at 21:28
@str to I have to compare it month by `Date.getMonth()+1` and day by `Date.getDate()` and year by `Date.getFullYear()` – Jamal Abo Jun 25 '19 at 21:30
@str can you check the newly edited code? (does it work)? – Jamal Abo Jun 25 '19 at 21:36
1

The "for older browsers" function is seriously flawed (and the only reason for "older" is the use of *const*, which is unnecessary). Parsing strings with the built–in parser is not a good idea, particularly when the string is not a format supported by ECMA-262. – RobG Jun 26 '19 at 01:36
@RobG what about `var`s? – Jamal Abo Jun 26 '19 at 23:03
@JamalAbo—fine, but it doesn't fix the logic errors, e.g. just because the month number is higher doesn't mean the date is later. E.g. 2019-01-01 has a lower month number than 2018-12-02, but is later. The same for the day number. – RobG Jun 27 '19 at 00:04

Marco Ghiani · Accepted Answer · 2019-06-25T21:36:18.897

-1

You could use Date.parse(date) to get the timestamp of the passed data and filter them if the difference with the current date is negative. Your code should be something like this:

const menuItems = [
  {
    name: 'Hamburger',
    expirationDate: '09-24-2019'
  },
  {
    name: 'Chicken',
    expirationDate: '10-03-2019'
  },
  {
    name: 'Hot-Dog',
    expirationDate: '03-24-2019'
  },
];

function filterByExpiration (items) {
  let today = new Date();
  let dd = today.getDate();
  let mm = today.getMonth();
  let yyyy = today.getFullYear();
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  today = mm + '-' + dd + '-' + yyyy;
  return menuItems.filter((item) => item.expirationDate > today)
};

edited Jun 25 '19 at 21:36

answered Jun 25 '19 at 21:28

Marco Ghiani

127
3

This does not work in some browsers. See [What are valid Date Time Strings in JavaScript](https://stackoverflow.com/questions/51715259/what-are-valid-date-time-strings-in-javascript)? – str Jun 25 '19 at 21:29
Updated, now should be fine – Marco Ghiani Jun 25 '19 at 21:36
1

That compares string lexicographically, not as dates, and the format used doesn't compare correctly as strings, e.g. `'06-20-2019' > '07-01-2018'` returns false, but should be true if compared as dates. Conversion to YYYY-MM-DD would work though. – RobG Jun 26 '19 at 01:41

score -1 · Answer 4 · answered Jun 25 '19 at 21:31

You are comparing two different string. Its much better to convert both date object in timestamp or any value where you can compare.

new Date(); //gives something like this Wed Jun 26 2019 02:55:59 GMT+0530

and you are trying to compare with '03-24-2019' something like this. Possible flow would be :

const menuItems = [{
    name: 'Hamburger',
    expirationDate: '09-24-2019'
  },
  {
    name: 'Chicken',
    expirationDate: '10-03-2019'
  },
  {
    name: 'Hot-Dog',
    expirationDate: '03-24-2019'
  },
];
const today = new Date().getTime();
const filterByExpiration = menuItems.filter((items)  => {
    return new Date(items.expirationDate).getTime() > today;
  })
console.log(filterByExpiration)

This does not work in some browsers. See [What are valid Date Time Strings in JavaScript](https://stackoverflow.com/questions/51715259/what-are-valid-date-time-strings-in-javascript)? And there are already three similarly non-working answers. — str, Jun 25 '19 at 21:32

Filter an array of objects by date that > than date.now

4 Answers4

For Older Browsers