Why doesn't this function replace the existing value in the associative array - Angular

Question

I've made sure to import my interface:

import { DayMoodModel } from '../objectModels/dayMood'; 

I initialized the array of objects with some test data (the date property has the type Date, in case you're wondering):

  moodsAssigned: DayMoodModel[] = [
    { 
      date: this.today,
      mood: 'great'
    }
  ]

This is the function in question:

  addMood(moodName: string) {
    let obj: DayMoodModel = { date: this.currentDay, mood: moodName };
    for(let i = 0; i < this.moodsAssigned.length; i++) {
      if(this.moodsAssigned[i].date == this.currentDay) {
        this.moodsAssigned[i].mood = moodName;
      }
      else if(i == this.moodsAssigned.length - 1 && this.moodsAssigned[i].date != this.currentDay) {
        this.moodsAssigned.push(obj);
      }
    }
    console.log(this.moodsAssigned);
  }

When called, on a date that's already in the array of objects, it acts like that data isn't already in there for that date. I'll include a photo of the console log at the bottom of the post. In this test I called the function on the date that is already in the array, expecting it to replace the 'mood' value with the new mood, but it just added a new object to the array.

I've gone over this code multiple times, logging out variables at key places to ensure it's reading everything correctly. I don't know what's wrong with the logic..

picture of the array logged to the console

Answer 1

The problem is you're trying to compare two complex objects, yet you only care about the day, month, and year. Just a straight == isn't going to work.

Here is a proper comparison function from another question: How to tell if two dates are in the same day or in the same hour?

function sameDay(d1, d2) {
  return d1.getFullYear() === d2.getFullYear() &&
    d1.getMonth() === d2.getMonth() &&
    d1.getDate() === d2.getDate();
}