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

Related searches

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

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)
}

JavaScript Array Filter: Filtering Array Elements Based on a Test , This tutorial shows you how to use the JavaScript array filter method to filter One of the most common tasks when working with an array is to create a new Like other iterative methods of the Array object such as every(), some(), map() Removing Whitespaces from Both Ends: trim() � Extracting a part of a String: slice ()� After that, call the filter () methods of the data array and pass in the isInRange () function and the range object. Because we pass in the range object, inside the isInRange () function, the this keyword references to the range object. Finally, show the result array in the web console.

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);

JavaScript Filter: Guide on Filtering Arrays and Creating New Ones, The JavaScript array filter function is closely related to map, push and length methods. These functions will give you more control over your arrays� Q: How to filter an array of objects having an array of objects Example object - [crayon-5f2f08e4bea98150972612/] A - When we consider the above object having an array of superheroes in members. Each superhero having an array of power. We need to get the superhero having the power 4/s

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;
}

Filter Arrays with the Javascript Filter() Method - DEV, JavaScript array filter method makes it even more fun. In my last blog A more efficient way is using the filter method. Now, let us Example 1: Filtering an array of objects Add chat into your Angular app with TalkJS - Part 2. JavaScript filter method is used to create a new array from an existing array. The JavaScript filter () method returns a new array which will be filtered from an original array. You will be performing a certain test on an original array and the elements that pass this test will be returned to the new array using this method.

Array.prototype.filter(), The filter() method creates a new array with all elements that pass the test Jump to section the value of the element; the index of the element; the Array object being traversed even though the `words` itself now has a lot more words with character length less than Learn the best of web development. filter method runs a given function on every item in the array and returns an array of all items for which the function returns true. This will help us to get each sub-array of the mainArray.

JavaScript Array Reference, prototype, Allows you to add properties and methods to an Array object. Array Methods. Method, Description. concat(), Joins two or more arrays, and returns a copy of the joined arrays filter(), Creates a new array with every element in an array that pass a test slice(), Selects a part of an array, and returns the new array. How to filter an array in Java Java 8 Object Oriented Programming Programming You can use List.removeAll () method to filter an array.

Use this command to filter any kind of object in PowerShell. The Where-Object command has a FilterScript parameter, which is a scriptblock that allows the user to place code in it. If this scriptblock contains code that returns anything but $false, $null, or an empty string, it will allow whichever object the user passes to it.

Comments
  • Should be item.hidden === false or !item.hidden
  • Thanks @Mike & @mhodges!