More efficient way to filter a portion of an object array?

Question

I have a large object array called items with this structure:

abc: [{object0}, {object1}, ... {objectN}],
def: [...],
ghi: [...],
jkl: [...]

I've simplified things for clarity. Suffice to say, def, ghi, and jkl contain the same object array structure as abc.

Each object# has many properties, one of them being hidden. hidden is generally false but for a few objects in the abc array it is true.

I want to return a new instance of items that has all of the hidden=true objects removed.

This code actually actually works:

items = {
  abc: items.abc.filter(item => item.hidden === false), 
  def: tasks.def,
  ghi: tasks.ghi,
  jkl: tasks.jkl
};

But I was wondering if there was a more elegant way to accomplish this?

Robert

Mike · Accepted Answer · 2020-02-10 23:30:22Z

2

You could do something like this

const data = {
// your source data set
}

const items = {}

for(let key in data) {
  items[key] = data[key].filter(item => item.hidden === false)
}

edited Feb 10, 2020 at 23:30

answered Feb 10, 2020 at 23:28

Mike

5733 silver badges15 bronze badges

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

2 Comments

mhodges Over a year ago

Should be item.hidden === false or !item.hidden

robertwerner_sf Over a year ago

Thanks @Mike & @mhodges!

sudo97 · Accepted Answer · 2020-02-10 23:31:59Z

1

You could spread (using the ... operator) your original items into a new object (say notHiddenItems) and then filter anykey you want to.

const items = { 
    // orginal items object 
};

let notHiddenItems = {...items);
notHiddenItems.abc.filter(each => !each.hidden);

answered Feb 10, 2020 at 23:31

sudo97

9142 gold badges11 silver badges24 bronze badges

Comments

zer00ne · Accepted Answer · 2020-02-11 05:16:49Z

The following function will accept any key/value combination. Details are commented in demo

let data = {
  abc: [{x: 13, xx: 'x', hidden: false}, {x: 47, xx: 'y', hidden: true}, {x: 36, xx: 'z', hidden: false}],
  def: [{x: 68, xx: 'z', hidden: false}, {x: 91, xx: 'x', hidden: false}, {x: 3, xx: 'y', hidden: true}],
  ghi: [{x: 22, xx: 'v', hidden: false}, {x: 1, xx: 'z', hidden: true}, {x: 76, xx: 'w', hidden: false}],
  jkl: [{x: 99, xx: 's', hidden: true}, {x: 7, xx: 'm', hidden: false}, {x: 66, xx: 'x', hidden: false}]
};

/*
Pass the data Object, the property to search for, and
one or more values to match
*/
const keepKV = (object, prop, ...values) => {
  /*
  Convert data Object into an Array of array pairs
  ex.
  let data = {'abc': [{...}, {...}, {...}], 'def': [...]}
  to
  data = [['abc',[{...}, {...}, {...}]], ['def', [...]]
  
  Object.entries(object)...
  */
  /*
  Destructure the .map() parameter 
  ex.
  subKey = 'abc'
  subArray = [{...}, {...}, {...}]

  .map(([subKey, subArray]) => {...
  */
  /*
  The last return on each iteration is an array of pairs:
  [subKey, [subArray]]
  ex.
  ["jkl", [{...}, {...}, {...}]]
  Each object of each subArray gets .filter() 
  
  return [subKey, subArray.filter(subObject => [...values].includes(subObject[prop]))];
  */
  /*
  The entire returned Array of arrays is then converted 
  back into an Object
  
  Object.fromEntries(ArrayOfArrays)
  */
  return Object.fromEntries(Object.entries(object).map(([subKey, subArray]) => {
  return [subKey, subArray.filter(subObject => [...values].includes(subObject[prop]))];
  }));
};

// Utility function that creates a ranged Number array
let range = Array(...Array(26)).map((_, i) => 5+i);

// Get all objects that has x: 5 to 30
const range5to30 = keepKV(data, 'x', ...range); console.log(`Key: 'x', Values: range\n
const range5to30 = ${JSON.stringify(range5to30, null, 2)}\n`);

// Get all objects that has xx: 'z' and/or 'x'
const xZOnly = keepKV(data, 'xx', 'z', 'x');
console.log(`Key: 'xx', Values: 'z', 'x'\n
const xZOnly = ${JSON.stringify(xZOnly, null, 2)}\n`);

// Get all objects that has hidden: false
const notHidden = keepKV(data, 'hidden', false);
console.log(`Key: 'hidden', Values: false\n
const notHidden = ${JSON.stringify(notHidden, null, 2)}\n`);

.as-console-wrapper {
  width: 375px;
  min-height: 100%;
  margin-left: 25%;
}

.as-console-row {
  border-bottom: 5px ridge #333
}

.as-console-row-code::first-line {
  text-decoration: underline;
}

.as-console-row.as-console-row::after,
.as-console-row-code.as-console-row-code::after {
  content:'';
  padding:0;
  margin:0;
  border:0;
  width:0;
}

Collectives™ on Stack Overflow

More efficient way to filter a portion of an object array?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related