Filter one array based on values of another, is this the best way?

Question

categories = [{id: "761601bc-4daf-4db2-a0cf-fe7f443fcb94", name: "Shoes"},{id: "601ebcfe-fcbd-4075-a4b4-a42e356c5747", name: "Hats"},{id: "238933cf-77a5-4443-b290-7d7c836f80ff", name: "Eyewear"}];

voucher = {id:1,categories:["761601bc-4daf-4db2-a0cf-fe7f443fcb94","601ebcfe-fcbd-4075-a4b4-a42e356c5747"]};

filterCategories(voucher) {
  const result = voucher.categories
    ? categories
        .filter(cat => {
          return voucher.categories.includes(cat.id);
        })
        .map(v => v.name)
        .sort()
        .join()
    : "";

  return result;
}

Expecting: "Hats,Shoes"

The result needs to be filtered and sorted and returned as a string. Is there a faster, more efficient way of doing this. Maybe using Lodash?

Answer 1

It may make sense to turn voucher.categories into a Set (or store them in a Set instead of an array in the first place) to speed up the contains call, however that is only sensible, if you expect it to contain a lot of items.

Other than that I'd move the check for the existence of voucher.categories (and add a check if it's empty) outside the expression, in order to reduce the indentations and make the code more readable:

filterCategories(voucher) {
  if (!voucher.categories || voucher.categories.length == 0) {
     return "";
  }
  return categories
    .filter(cat => voucher.categories.includes(cat.id))
    .map(v => v.name)
    .sort()
    .join();
}

Answer 2

Normally there are a lot of categories, so I'd go through the voucher.categories array:

const filterCategories = (voucher, categories) => (
  Array.isArray(voucher.categories) ?
    voucher.categories
      .map(categoryId => {
        const categoryFound = categories.find(c => c.id === categoryId);
        return categoryFound ? categoryFound.name : null;
      })
      .filter(categoryName => categoryName !== null)
      .sort()
      .join() :
    ""
);

This way you don't have to go through the entire list of 'master' categories (which in practice may be very long) doing a search on the voucher categories in each iteration.

Note: it would be much faster if you could have the categories as an object with the id as index:

categories = {
  ["761601bc-4daf-4db2-a0cf-fe7f443fcb94"]: {name: "Shoes"},
  ["601ebcfe-fcbd-4075-a4b4-a42e356c5747"]: {name: "Hats"},
  ["238933cf-77a5-4443-b290-7d7c836f80ff"]: {name: "Eyewear"}
};

const filterCategories = (voucher, categories) => (
      Array.isArray(voucher.categories) ?
        voucher.categories
          .map(categoryId => {
            const categoryFound = categories[categoryId];
            return categoryFound ? categoryFound.name : null;
          })
          .filter(categoryName => categoryName !== null)
          .sort()
          .join() :
        ""
    );