Dynamically change the key in a filter query

Question

I've created a simple filtering code that filters out 0s and nulls. Perhaps not the most elegant, but it works:

var data = [{"location": 30, "year": 2019},
            {"location": 60, "year" : 1928},
            {"location": 0, "year": 2019},
            {"location": 50, "year": 0}];
    
var filteredData = [];

for (var i = 0; i < data.length; ++i) {
  if (data[i].location !== null && data[i].location != 0) {
    filteredData.push({
      location: data[i].location,
      year: data[i].year
    })
  }
};
console.log(filteredData);

Now I would like to filter out 0s and nulls for other keys (e.g. year), how can I dynamically change key?

My (perhaps naive) thinking was to create a variable indicating the key I want to filter out

Unfortunately that didn't work. Does anyone have a suggestion or help me in the right direction?

var var1 = 'year';
    
var data = [{"location": 30, "year": 2019},
            {"location": 60, "year" : 1928},
            {"location": 0, "year": 2019},
            {"location": 50, "year": 0}];

var filteredData = [];

for (var i = 0; i < data.length; ++i) {
  if (data[i].var1 !== null && data[i].var1 != 0) {
    filteredData.push({
      location: data[i].location,
      year: data[i].year
    })
  }
};

console.log(filteredData)

mplungjan · Answer 1 · 2022-06-10T12:43:43.237

3

Your issue is that you need to use bracket notation instead of dot notation for variable keys.

That said, JavaScript has an Array filter method

You can then use every to have dynamic keys in an array:

const data = [{"location": 30, "year": 2019},
            {"location": 60, "year" : 1928},
            {"location": 0, "year": 2019},
            {"location": 50, "year": 0}];

const notZero = ["location","year"]

const filteredData = data.filter(item => notZero.every(key => item[key] !== 0))

console.log(filteredData)

edited Jun 10 '22 at 12:43

answered Jun 10 '22 at 12:09

mplungjan

169,008
28
173
236

just my 0.02: use `!==` instead of `!=` – syedmh Jun 10 '22 at 12:11
Yes, bad habit.... – mplungjan Jun 10 '22 at 12:12
thanks, that is a more elegant solution and will try to implement this. – Ant Jun 10 '22 at 12:32

score 2 · Accepted Answer · answered Jun 10 '22 at 12:00

2

instead of data[i].var1 try data[i][var1]. the square brackets allows you to have a dynamic key.

answered Jun 10 '22 at 12:00

gil

2,388
1
21
29

thanks, that was the answer I was looking for. So simple :) – Ant Jun 10 '22 at 12:33
[That was an easily found dupe](https://stackoverflow.com/questions/4968406/javascript-property-access-dot-notation-vs-brackets) – mplungjan Jun 10 '22 at 12:45

score 0 · Answer 3 · answered Jun 10 '22 at 12:19

If you can have 0 or null in your data, you need to do this:

const data = [{"location": 30, "year": 2019},
            {"location": 60, "year" : 1928},
            {"location": 0, "year": 2019},
            {"location": 50, "year": 0}];

const filteredData = data.filter(item => !Object.values(item).filter(value => !value).length)

This lets you dynamically check all values within an object and check if all of them are truthy values, thereby catching all falsy values.

Dynamically change the key in a filter query

3 Answers3