CryptoGeek981
CryptoGeek981

Reputation: 111

Javascript modify object in filter array

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.

Upvotes: 0

Views: 528

Answers (3)

Siva Kondapi Venkata
Siva Kondapi Venkata

Reputation: 11001

With forEach loop, in one iteration and add items to results only on filter criteria

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 isHigh = ({ population }) => population >= 100;

const highPopulation = (arr, res = []) => {
  arr.forEach(
    (item) => isHigh(item) && res.push({ ...item, isHighPopulation: true })
  );
  return res;
};

console.log(highPopulation(cities));

Upvotes: 0

Majed Badawi
Majed Badawi

Reputation: 28424

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)

Upvotes: 1

StriplingWarrior
StriplingWarrior

Reputation: 156634

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.

Upvotes: 0

Related Questions