What could be causing this Promise to bypass the forEach loop?

Question

What could be causing this Promise to bypass the forEach loop?

I'm encountering an issue with this block of code. While attempting to return a Promise, I've noticed that during debugging, it seems to "skip" the forEach loop and rejects the function instead. Can you help me identify what might be causing this behavior?

removeOldBookings(rooms: Room[]) {
  return new Promise((resolve, reject) => {
    const today = new Date();
    const roomsHolder = [];
    rooms.forEach(roomElement => {
      const bookingFiltered = roomElement[1].filterRoom.filter(finder => finder.provider.toUpperCase() === 'SELF');
      if (new Date(bookingFiltered.dateEnd) > today) {
        const obj = {...roomElement[1], hostBookings: [...bookingFiltered]};
        roomsHolder.push(obj);
      }
    });
    if (roomsHolder.length) {
      resolve(roomsHolder);
    } else {
      reject('error');
    }
  });
}

javascript typescript

Answer 1

Answer №1

According to charlietfl's explanation, when using filter in

roomElement[1].filterRoom.filter(...)

, an array is returned, making bookingFiltered an array as well. However, since bookingFiltered.dateEnd is undefined, it results in an invalid date which then converts to NaN when used with > (greater than) comparison. Given that NaN will never be greater than anything, the code within the if block will not be executed, resulting in roomsHolder always being empty.

If you are aiming to retrieve the first item from an array that meets a specific condition, consider using find instead:

const bookingFiltered = roomElement[1].filterRoom.find(finder => finder.provider.toUpperCase() === 'SELF')

In addition, following Daniel A. White's advice, it is unnecessary to return a promise at this point. Rather, you can simply return roomsHolder and throw an error if needed:

removeOldBookings(rooms: Room[]) {
  const today = new Date();
  const roomsHolder = [];
  rooms.forEach(roomElement => {
    const bookingFiltered = roomElement[1].filterRoom.find(finder => finder.provider.toUpperCase() === 'SELF');
    if (new Date(bookingFiltered.dateEnd) > today) {
      const obj = {...roomElement[1], hostBookings: [...bookingFiltered]};
      roomsHolder.push(obj);
    }
  });
  if (roomsHolder.length) {
    return roomsHolder;
  } else {
    throw 'error';
  }
}

If returning a promise is necessary for any reason, you can also declare the method as async function or utilize Promise.resolve(roomsHolder) for success and Promise.reject('error') for failure, rather than encapsulating everything within the promise constructor.

Answer 2

According to charlietfl's explanation, when using filter in

roomElement[1].filterRoom.filter(...)

, an array is returned, making bookingFiltered an array as well. However, since bookingFiltered.dateEnd is undefined, it results in an invalid date which then converts to NaN when used with > (greater than) comparison. Given that NaN will never be greater than anything, the code within the if block will not be executed, resulting in roomsHolder always being empty.

If you are aiming to retrieve the first item from an array that meets a specific condition, consider using find instead:

const bookingFiltered = roomElement[1].filterRoom.find(finder => finder.provider.toUpperCase() === 'SELF')

In addition, following Daniel A. White's advice, it is unnecessary to return a promise at this point. Rather, you can simply return roomsHolder and throw an error if needed:

removeOldBookings(rooms: Room[]) {
  const today = new Date();
  const roomsHolder = [];
  rooms.forEach(roomElement => {
    const bookingFiltered = roomElement[1].filterRoom.find(finder => finder.provider.toUpperCase() === 'SELF');
    if (new Date(bookingFiltered.dateEnd) > today) {
      const obj = {...roomElement[1], hostBookings: [...bookingFiltered]};
      roomsHolder.push(obj);
    }
  });
  if (roomsHolder.length) {
    return roomsHolder;
  } else {
    throw 'error';
  }
}

If returning a promise is necessary for any reason, you can also declare the method as async function or utilize Promise.resolve(roomsHolder) for success and Promise.reject('error') for failure, rather than encapsulating everything within the promise constructor.

What could be causing this Promise to bypass the forEach loop?

Answer №1

Similar questions

Why is the text returned by the Angular Response body missing the JSON brackets? Strange, isn't it

What is the best way to gather Data URI content through dropzone.js?

Using Laravel 8 to create connected dropdown menus with the power of Ajax

Transferring files from the android_asset directory to the SD Card

Could someone clarify why EventEmitter leads to issues with global variables?

Is it possible to host multiple React applications on a single port? Currently experiencing issues with running both an Admin panel and the Front side in production mode on the same Node.js API server

Vuetify: The checkbox displays the opposite status of whether it is checked or unchecked

Is it possible for external sources to change the values stored in local storage of an

Tips for Sending Information to the Current Page Using JQuery

Error encountered during Typescript compilation: Type 'void' cannot be assigned to type 'Item[]'

Working with ReactJS, Material-UI, and Javascript: Facing challenges in applying rounded borders to TableRow components

Could you provide me with a demonstration of cross-domain functionality?

Guide to playing a gif solely through an onclick event using JavaScript

Cryptocurrency price tracker with sleek Bitcoin symbol and FontAwesome icons

Encountering ORA-01008 error while utilizing nodeOracledb in TypeScript

Ways to add elements to an array nested within services and append to an object within another object

Ways to ensure the express route accesses my mocked module instead of the main one when making a request to it with supertest

Step-by-Step Guide on Incorporating leaflet-control-geocoder into Angular 12.x

"Looking for a datetime picker plugin that works well with Bootstrap

The hovering effect on the image link is causing the surrounding div to stretch too far