Question

我有一个数组对象

events = [
   {
     year: "2019",
     month: "June",
     title: "title",
     desc: "desc"
   },
   {
     year: "2019",
     month: "June",
     title: "title",
     desc: "desc"
    },
    {
      year: "2019",
      month: "July",
      title: "title",
      desc: "desc"
    },
    {
      year: "2018",
      month: "June",
      title: "title",
      desc: "desc"
     },
     {
       year: "2018",
       month: "March",
       title: "title",
       desc: "desc"
     },
     {
       year: "2018",
       month: "March",
       title: "title",
       desc: "desc"
      }
    ]

如何对数组进行排序以显示相似的年份和月份，我需要在react组件中使用它，例如，一行将显示2019年6月，另一行将显示2019年7月，然后显示2018年6月，依此类推，

任何帮助将不胜感激

Answer 1

您需要为.sort提供自定义比较器功能，以便使用月份和年份进行排序。

const events = [
   {
     year: "2019",
     month: "June",
     title: "title",
     desc: "desc"
   },
   {
     year: "2019",
     month: "June",
     title: "title",
     desc: "desc"
    },
    {
      year: "2019",
      month: "July",
      title: "title",
      desc: "desc"
    },
    {
      year: "2018",
      month: "June",
      title: "title",
      desc: "desc"
     },
     {
       year: "2018",
       month: "March",
       title: "title",
       desc: "desc"
     },
     {
       year: "2018",
       month: "March",
       title: "title",
       desc: "desc"
      }
];

// Custom comparator function
function sortByMonthYear(a, b) {
	const keyA = `${a.month} ${a.year}`;
	const keyB = `${b.month} ${b.year}`;
	
	if (keyA.localeCompare(keyB)) {
		return -1;
	}
	else if (keyA === keyB) {
		return 0;
	}
	return 1;
}


const grouping = events.sort(sortByMonthYear);

console.log(grouping);

更新：

您还可以使用Array#prototype#reduce

对数据进行分组

const events = [{
    year: "2019",
    month: "June",
    title: "title",
    desc: "desc"
  },
  {
    year: "2019",
    month: "June",
    title: "title",
    desc: "desc"
  },
  {
    year: "2019",
    month: "July",
    title: "title",
    desc: "desc"
  },
  {
    year: "2018",
    month: "June",
    title: "title",
    desc: "desc"
  },
  {
    year: "2018",
    month: "March",
    title: "title",
    desc: "desc"
  },
  {
    year: "2018",
    month: "March",
    title: "title",
    desc: "desc"
  }
];

const grouping = events.reduce((acc, curr) => {
  const key = `${curr.month} ${curr.year}`;
  if (!acc[key]) {
    acc[key] = [curr];
  } else {
    acc[key].push(curr);
  }
  return acc;
}, {});

console.log(grouping);

Answer 2

创建对一年中所有月份的引用，并通过它们flatMap，在flatMap中对原始事件运行过滤器，以仅返回与当前月份共享month的任何事件在迭代中。完成此操作后，您可以在列表上运行sort，以确保事件按year排序（从最小到最大）

const MOY = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
const events = [
 {year: "2019",month: "June",title: "title",desc: "desc"},
 {year: "2019",month: "June",title: "title",desc: "desc"},
 {year: "2019",month: "July",title: "title",desc: "desc"},
 {year: "2018",month: "June",title: "title",desc: "desc"},
 {year: "2018",month: "March",title: "title",desc: "desc"},
 {year: "2018",month: "March",title: "title",desc: "desc"}
]
    
  
const sortedByMonth = MOY.flatMap(m => events.filter(({month}) => m === month))
const sortedByYear = sortedByMonth.sort((eA, eB) => eA.year < eB.year) 
  
console.log(sortedByMonth)
console.log(sortedByYear)

或者，如果您想按月对事件进行分组，而按年份对事件进行排序，则可以这样做

const MOY = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
const events = [
 {year: "2019",month: "June",title: "title",desc: "desc"},
 {year: "2019",month: "June",title: "title",desc: "desc"},
 {year: "2019",month: "July",title: "title",desc: "desc"},
 {year: "2018",month: "June",title: "title",desc: "desc"},
 {year: "2018",month: "March",title: "title",desc: "desc"},
 {year: "2018",month: "March",title: "title",desc: "desc"}
] 
  
const sorted = MOY.flatMap(m => (
  events
  .filter(({month}) => m === month)
  .sort((eA, eB) => eA.year < eB.year)
))
  
console.log(sorted)

如何基于javascript中的多个字段对数组进行排序

2 个答案: