reduce down array to remove duplicate matchId entries from left to right

Question

I'm pushing an object to an array when the user updates a score for a matchId, I would like my final array to remove all the oldest duplicates of matchId, so from index 0 until the end, is there way?

I have this:

cleanData =
    0: {matchId: "271691", homeTeamScore: "1", awayTeamScore: "1"}
    1: {matchId: "271692", homeTeamScore: "1", awayTeamScore: "1"}
    2: {matchId: "271700", homeTeamScore: "1", awayTeamScore: "1"}
    3: {matchId: "271691", homeTeamScore: "6", awayTeamScore: "6"}
    4: {matchId: "271691", homeTeamScore: "8", awayTeamScore: "8"}
    5: {matchId: "271691", homeTeamScore: "8", awayTeamScore: "8"}
    6: {matchId: "271691", homeTeamScore: "8", awayTeamScore: "0"}

I would like this:

0: {matchId: "271692", homeTeamScore: "1", awayTeamScore: "1"}
1: {matchId: "271700", homeTeamScore: "1", awayTeamScore: "1"}
2: {matchId: "271691", homeTeamScore: "8", awayTeamScore: "0"}

My code:

saveResult(data: any, pushMatchId: any) {
    if (this.savedResults) {
      let cleanData = this.savedResults.map((item) => {
        return {
          matchId: item.matchId,
          homeTeamScore: item.homeTeamScore,
          awayTeamScore: item.homeTeamScore,
        };
      });
      data.map((item) => {
        cleanData.push(item);
      });
      this.db.collection("users").doc(this.user.uid).update({
        results: cleanData,
      });
    } else {
      this.db.collection("users").doc(this.user.uid).set({
        results: data,
      });
    }

  }

Answer 1

Since the latest objects in the array are the ones you want, then you could use reduceRight() and just add to the final result the matches that are not already in the final array, something like:

let matches = [
  { matchId: "271691", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271692", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271700", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271691", homeTeamScore: "6", awayTeamScore: "6" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "8" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "8" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "0" },
];

let result = matches.reduceRight(
  (p, c) => (!p.find((o) => o.matchId === c.matchId) ? [...p, c] : p),
  []
);

console.log(result);

or a more optimized approach, storing the latest matchIds in a map:

let matches = [
  { matchId: "271691", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271692", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271700", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271691", homeTeamScore: "6", awayTeamScore: "6" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "8" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "8" },
  { matchId: "271691", homeTeamScore: "8", awayTeamScore: "0" },
];

let matchIds = new Map();
let result = matches.reduceRight((p, c) => {
  if (!matchIds.get(c.matchId)) {
    matchIds.set(c.matchId, true);
    return [...p, c];
  }
  return p;
}, []);

console.log(result);

In the case where you want to check beforehand if there are already matches with a certain id and filter them out before adding the latest one, you could do something like:

let matches = [
  { matchId: "271691", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271692", homeTeamScore: "1", awayTeamScore: "1" },
  { matchId: "271700", homeTeamScore: "1", awayTeamScore: "1" },
];

let addMatch = (match) => {
  matches = matches.filter(({
    matchId
  }) => matchId !== match.matchId);
  return matches.push(match), matches;
};

let latest = { matchId: "271691", homeTeamScore: "6", awayTeamScore: "6" };

addMatch(latest); // Add the latest match, replace if there was already a score

console.log(matches);