Grouping data to month wise in JavaScript

In JavaScript, grouping and sorting data by months is a common requirement when working with date-based information. This involves sorting objects first by year, then by month in chronological order from January to December.

Arrays in JavaScript provide powerful methods like sort() and indexOf() that make this task straightforward. The key challenge is properly comparing month names since they need to be sorted in calendar order, not alphabetically.

Problem Statement

Given an array of objects with year and month properties, we need to sort them chronologically. For example:

const data = [
   { year: 2020, month: 'April' },
   { year: 2020, month: 'January' },
   { year: 2017, month: 'May' },
   { year: 2017, month: 'March' }
];

console.log("Original data:", data);

Original data: [
  { year: 2020, month: 'April' },
  { year: 2020, month: 'January' },
  { year: 2017, month: 'May' },
  { year: 2017, month: 'March' }
]

The expected sorted output should be:

[
  { year: 2017, month: 'March' },
  { year: 2017, month: 'May' },
  { year: 2020, month: 'January' },
  { year: 2020, month: 'April' }
]

Solution Approach

The solution involves creating a custom comparison function that:

• First compares years numerically
• If years are equal, compares months using their chronological order
• Uses an array of month names to determine month order via indexOf()

Complete Example

// Sample data with names, years, and months
const data = [
   { name: 'Pearl', year: 2020, month: 'January' },
   { name: 'John', year: 2017, month: 'March' },
   { name: 'Peter', year: 2010, month: 'January' },
   { name: 'Nick', year: 2010, month: 'December' },
   { name: 'Angel', year: 2020, month: 'October' },
   { name: 'Jas', year: 2017, month: 'June' }
];

// Array of months in chronological order
const months = [
   'January', 'February', 'March', 'April', 'May', 'June',
   'July', 'August', 'September', 'October', 'November', 'December'
];

// Custom comparison function
const sortByMonthYear = (a, b) => {
   // First compare years
   if (a.year !== b.year) {
      return a.year - b.year;
   }
   // If years are equal, compare months using indexOf
   return months.indexOf(a.month) - months.indexOf(b.month);
};

// Sort the data
data.sort(sortByMonthYear);
console.log("Sorted data:", data);

Sorted data: [
  { name: 'Peter', year: 2010, month: 'January' },
  { name: 'Nick', year: 2010, month: 'December' },
  { name: 'John', year: 2017, month: 'March' },
  { name: 'Jas', year: 2017, month: 'June' },
  { name: 'Pearl', year: 2020, month: 'January' },
  { name: 'Angel', year: 2020, month: 'October' }
]

How It Works

The sort() method uses the custom comparison function:

• a.year - b.year sorts years in ascending order
• months.indexOf(a.month) - months.indexOf(b.month) sorts months chronologically
• indexOf() returns the position of each month in the months array

Alternative: Using Date Objects

const data = [
   { name: 'Alice', year: 2020, month: 'March' },
   { name: 'Bob', year: 2020, month: 'January' },
   { name: 'Charlie', year: 2019, month: 'December' }
];

// Sort using Date constructor
data.sort((a, b) => {
   const dateA = new Date(a.year, new Date(`${a.month} 1, 2000`).getMonth());
   const dateB = new Date(b.year, new Date(`${b.month} 1, 2000`).getMonth());
   return dateA - dateB;
});

console.log("Sorted with Date objects:", data);

Sorted with Date objects: [
  { name: 'Charlie', year: 2019, month: 'December' },
  { name: 'Bob', year: 2020, month: 'January' },
  { name: 'Alice', year: 2020, month: 'March' }
]

Performance Considerations

The time complexity is O(n log n) due to the sorting operation, where n is the number of objects. The space complexity is O(1) additional space since sort() modifies the array in-place.

Conclusion

Grouping data by months in JavaScript is efficiently achieved using the sort() method with a custom comparison function. The indexOf() method on a predefined months array ensures proper chronological ordering of month names.