Question 184697 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Is there a better way to refactor map and filter code

I have an array of data. array contains over 500k items. I want to map items in the array then fileter it. This is what I have done.

I create a function that filters array tpo get unique values

const getUniqueValues = (array: string[]): string[] => {
  return array.filter((item, index, _array) => _array.indexOf(item) === index);
};

then I pass in the mapped data into the function

const uniqueValues = getUniqueValues(
  editedData.map((bodyItem: any) => bodyItem[index])
).filter(Boolean);

This worked well and faster when the array contains less items. Now, it takes sometimes five to ten minutes to perform action, which isn’t good for user experience. Now uniqueValue returns aproximately 210,000 items in array

Is there a better way to perform this in less time?

I have tried array.reduce, not sure of my code tho cos it seems not to solve the problem. if someone could check it out, i’ll appreciate

          const uniqueValues = editedData.reduce(
            (accumulator, bodyItem) => {
              const item = bodyItem[index];
              if (!accumulator.includes(item)) {
                accumulator.push(item);
              }
              return accumulator;
            },
            []
          );
Tags:

2

Answers


  1. 0

    With that high amount of items, you should be using the builtin Set class, which will get rid of duplicates efficiently. Just replace getUniqueValues with the code below

    const getUniqueValues = (array: string[]): string[] => {
  return [...new Set(array)];
};
    Login or Signup to reply.
  2. 0

    can you try this :

    const uniqueValues = Array.from(new Set(editedData.map((bodyItem: any) => bodyItem[index]))).filter(Boolean);
    • new Set(editedData.map((bodyItem: any) => bodyItem[index])) creates a Set, automatically removing any duplicate values.
    • Array.from() then converts this Set back into an array.
    • .filter(Boolean) filters out any falsy values.
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search