Jquery Filter array by date range

Viewed 1136

I have an array that contains date objects.

But the data is too large to parse everything. I want to filter results by date range (eg: between 10 days ago to the 10 days). So far, I can only filter with a single date.

Here's my code. I just don't how to go about achieving that.

var today = new Date();
var d = today.getDay();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = today.getFullYear();
today = yyyy + '-' + mm + '-' + dd;

var eventParsed = JSON.parse(eventsObjects).filter(({
    date
}) => date === today);

console.log(eventParsed);
5 Answers

You can get the bound dates such as today minus 10 days and today plus 10 days and then, use them in the filter :

function formatDate(date)
{
    var d = date.getDay();
    var dd = String(date.getDate()).padStart(2, '0');
    var mm = String(date.getMonth() + 1).padStart(2, '0'); //January is 0!
    var yyyy = date.getFullYear();
    return yyyy + '-' + mm + '-' + dd;
}

function getDateFromTodayPlus(numberOfDays)
{
    const d = new Date();
    d.setDate(d.getDate() + numberOfDays);
    return formatDate(d);
}

const TenDaysAgoString = getDateFromTodayPlus(-10);

const TenDaysAfterString = getDateFromTodayPlus(10);

// And then, in your filter :

var eventParsed = JSON.parse(eventsObjects).filter(({
    date
}) => TenDaysAgoString <= date && date <= TenDaysAfterString);

I think you can avoid the string manipulation all together and just do some date comparisons like this:

var today = new Date();
var tenDaysAgo = new Date();
var tenDaysFromNow = new Date();
tenDaysAgo.setDate(today.getDate() - 10);
tenDaysFromNow.setDate(today.getDate() + 10);

var eventParsed = JSON.parse(eventsObjects).filter(({
    date
}) => date >= tenDaysAgo && date <= tenDaysFromNow);

console.log(eventParsed);

Is the data sorted? Because then this is a very simple pick by using a binary search and picking out the contiguous range. If it's not sorted and sorting it is not viable then you can use JS date objects to determine if a date is inside your range when filtering.

check if one date is between two dates (javascript)

However, if you will need to do this range picking alot, then sorting it first and doing the faster binary search for the interval ends would be better.

Easy! you have most of it actually this will filter between a range of dates, you just have to get "10 days ago" date and todays date and filter for anything between those dates.

//start date ten days ago
var startDate = new Date();
startDate.setDate(startDate.getDate() - 10);
//today
var endDate= new Date(); 

var filteredDates= JSON.parse(eventsObjects).filter(
   ({date}) => 
       date >= startDate && date <= endDate
);

Assuming your parsed JSON string contained the dates as strings and these dates are still represented as strings in the resulting object you could do the filtering like this:

const eventsObjects=[{a:123, date:'2019-10-02'},{a:1123, date:'2019-10-03'},{a:11123, date:'2019-10-09'},{a:111123, date:'2019-10-12'},{a:444123, date:'2019-10-13'},{a:44123, date:'2019-10-31'},{a:4123, date:'2019-11-09'},{a:5123, date:'2019-12-13'}];

var fmt=days=>{ 
 var dat=new Date((new Date()).getTime()+days*86400000);
 var dd = String(dat.getDate()).padStart(2, '0'),
     mm = String(dat.getMonth() + 1).padStart(2, '0'),
   yyyy = dat.getFullYear();
 return yyyy+'-'+mm+'-'+dd;
}
var d1=fmt(-10), d2=fmt(10); 
var eventParsed = eventsObjects.filter(({date}) =>
 (date>=d1 && date<=d2) );


console.log(eventParsed);

In this approach I generate the date strings only once from the current date object (adding and subtracting 10 days). The filtering itself then happens by comparing simple (date-)strings.

Related