How do I filter an array based on a range of numbers?

arrays, html, javascript

Solution

Use `array.filter` with a callback. The code below uses a dictionary with entries corresponding to option values.

var myArray = [1,2,3,3.1,Math.PI,4,4.3,6.1]; //sample array
//Dictionary from option values to functions (JS objects work like hashtables)
var options = {
  "l1":   function(a){return a.duration<1;},
  "1to3": function(a){return a.duration>=1 && a.duration<3;},
  "3to6": function(a){return a.duration>=3 && a.duration<=6;},
...
//When you need to filter the array, do it like so:
var myNewArray = myArray.filter(
  options[ document.getElementById('duration').selectedOptions[0].value ]
);

Problem

I have an array that I filter with this function: ``` function filter(arr, criteria) { return arr.filter(function(obj) { return Object.keys(criteria).every(function(c) { return !(criteria[c]) || obj[c] == criteria[c]; }); }); } var arr = filter(arr, { dep: dv, arr: av, car: cv, epi: acv, dur: dv }); ``` And I have a bunch of options that the user can choose from in the select. For duration, here is what I have: ``` <select name="duration" id="duration"> <option selected disabled hidden value="">-</option> <option value="l1">Less than 1 hour</option> <option value="1to3">1 to 3 hours</option> <option value="3to6">3 to 6 hours</option> <option value="6to10">6 to 10 hours</option> <option value="m10">More than 10 hours</option> </select> ``` But that filter is based on exact criteria. I want to filter float numbers in `arr` that are between 1 and 3 or 6 and 10. I also want to be able to run my other filters that you see up there with dep, arr, car, epi, dur. Is there any way I can do this?

Original source