Javascript modify object in filter array-CodePudding

I have an array of objects that I need to filter. I am wondering if it is possible to modify the object in the filter function. I dont want to use .map then .filter because then it would loop thru the array twice making it take more time and wont scale if there are thousands of items in the list.

const cities = [
  {name: 'Los Angeles', population: 100},
  {name: 'New York', population: 80},
  {name: 'Chicago', population: 120},
  {name: 'Houston', population: 60},
  {name: 'Philadelphia', population: 70}
];

const highPopulation = cities.filter(item => {
  // item.isHighPopulation = true
  return item.population >= 100
});

console.log(highPopulation)

Maybe filter isnt the best solution to this problem. I just dont want multiple unessecary loops if I can do this operation in one loop.

CodePudding user response：

I am wondering if it is possible to modify the object in the filter function.

It is possible. The code you've posted would do what you're asking if you uncomment the commented line.

It is also a bad idea. Mutating objects in a transformation method like filter violates the command-query separation principle.

I dont want to use .map then .filter

Hopefully you're not modifying objects in map either: you should be creating new objects instead. Something like .map(item => {...item, isHighPopulation: item.population >= 100}).

because then it would loop thru the array twice making it take more time and wont scale if there are thousands of items in the list.

Have you tested this assumption? In my experience it's rare for something to take an acceptable amount of time to do x operations, but an unacceptable amount of time to do 2x operations. If performance is an issue for you, it's probably better to take a broader look at your algorithms and data models. If not, you should probably not be worrying overmuch about it.

CodePudding user response：

Using Array#reduce:

const cities = [
  {name: 'Los Angeles', population: 100},
  {name: 'New York', population: 80},
  {name: 'Chicago', population: 120},
  {name: 'Houston', population: 60},
  {name: 'Philadelphia', population: 70}
];

const highPopulation = cities.reduce((items, item) => {
  if(item.population >= 100) items.push({...item, isHighPopulation: true});
  return items;
}, []);

console.log(highPopulation)

Using Array#filter and Array#map:

const cities = [
  {name: 'Los Angeles', population: 100},
  {name: 'New York', population: 80},
  {name: 'Chicago', population: 120},
  {name: 'Houston', population: 60},
  {name: 'Philadelphia', population: 70}
];

const highPopulation = cities
  .filter(({ population }) => population >= 100)
  .map(item => ({...item, isHighPopulation: true}));

console.log(highPopulation)