在 JavaScript 中按日期属性对对象数组进行排序

Sort an Array of Objects by Date property in JavaScript

要按日期属性对对象数组进行排序：

调用sort()数组上的方法。
从第一个对象中的日期减去第二个对象中的日期。
返回结果。

索引.js


const arr1 = [
  {id: 3, date: new Date(2022, 1, 24)},
  {id: 5, date: new Date(2027, 1, 24)},
  {id: 2, date: new Date(2023, 1, 24)},
];

// ✅ Sort in Ascending order (low to high)
const sortedAsc = arr1.sort(
  (objA, objB) => Number(objA.date) - Number(objB.date),
);

// 👇️ {id: 3, date: Thu Feb 24 2022,
//     id: 2, date: Fri Feb 24 2023
//     id: 5, date: Wed Feb 24 2027}
console.log(sortedAsc);

如果您需要按日期属性按降序对对象数组进行排序，请改用以下代码示例。

索引.js


const arr1 = [
  {id: 3, date: new Date(2022, 1, 24)},
  {id: 5, date: new Date(2027, 1, 24)},
  {id: 2, date: new Date(2023, 1, 24)},
];

// ✅ Sort in Descending order (high to low)
const sortedDesc = arr1.sort(
  (objA, objB) => Number(objB.date) - Number(objA.date),
);

//  👇️ {id: 5, date: Wed Feb 24 2027,
//      id: 2, date: Fri Feb 24 2023,
// ️     id: 3, date: Thu Feb 24 2022}
console.log(sortedDesc);

该代码片段假定您的对象数组包含Date对象。

按具有字符串值的日期属性对对象数组进行排序

如果它包含Date字符串，请在调用之前使用该Array.map()方法将字符串转换为对象。DateArray.sort()

索引.js


const arr1 = [
  {id: 3, date: '2022-02-24'},
  {id: 5, date: '2027-02-24'},
  {id: 2, date: '2023-02-24'},
].map(obj => {
  return {...obj, date: new Date(obj.date)};
});

console.log(arr1);

// ✅ Sort in Ascending order (low to high)
const sortedAsc = arr1.sort(
  (objA, objB) => Number(objA.date) - Number(objB.date),
);

// 👇️ {id: 3, date: Thu Feb 24 2022,
//     id: 2, date: Fri Feb 24 2023
//     id: 5, date: Wed Feb 24 2027}
console.log(sortedAsc);

如果您需要按降序对数组进行排序，请在对的调用中从第二个参数中减去第一个参数sort()。

索引.js


const arr1 = [
  {id: 3, date: '2022-02-24'},
  {id: 5, date: '2027-02-24'},
  {id: 2, date: '2023-02-24'},
].map(obj => {
  return {...obj, date: new Date(obj.date)};
});

console.log(arr1);

// ✅ Sort in Descending order (high to low)
const sortedDesc = arr1.sort(
  (objA, objB) => Number(objB.date) - Number(objA.date),
);

//  👇️ {id: 5, date: Wed Feb 24 2027,
//      id: 2, date: Fri Feb 24 2023,
// ️     id: 3, date: Thu Feb 24 2022}
console.log(sortedDesc);

该代码片段展示了如果您的起点是包含带日期字符串的对象的数组，如何按日期属性对对象数组进行排序。

我们使用Array.sort()方法按日期属性对对象数组进行排序。

该sort()方法对数组的元素进行就地排序并返回排序后的数组。换句话说，它改变了原始数组。

按日期属性对对象数组进行无突变排序

如果您需要对数组进行排序而不改变它，请在调用该方法之前使用扩展语法 (…) 创建一个浅表副本sort()。

索引.js


const arr1 = [
  {id: 3, date: new Date(2022, 1, 24)},
  {id: 5, date: new Date(2027, 1, 24)},
  {id: 2, date: new Date(2023, 1, 24)},
];

// ✅ Sort in Ascending order (low to high)
const sortedAsc = [...arr1].sort(
  (objA, objB) => Number(objA.date) - Number(objB.date),
);

// 👇️ {id: 3, date: Thu Feb 24 2022,
//     id: 2, date: Fri Feb 24 2023
//     id: 5, date: Wed Feb 24 2027}
console.log(sortedAsc);

在调用该方法之前，我们使用
扩展语法 (…)将数组的值解压缩到一个新数组中sort
。

我们将
Date
对象传递给Number函数以获取每个日期的时间戳。

在幕后，DateJavaScript 中的每个对象都存储从 1970 年 1 月 1 日 00:00:00 到给定日期之间经过的毫秒数。

索引.js


// 👇️ 1645454934750
console.log(Number(new Date()));

您可以显式调用
getTime方法来获取时间戳。

索引.js


// 👇️ 1645454934750
console.log(new Date().getTime());

我们传递给该方法的参数sort()是一个定义排序顺序的函数。

索引.js


const arr1 = [
  {id: 3, date: new Date(2022, 1, 24)},
  {id: 5, date: new Date(2027, 1, 24)},
  {id: 2, date: new Date(2023, 1, 24)},
];

// ✅ Sort in Ascending order (low to high)
const sortedAsc = arr1.sort(
  (objA, objB) => Number(objA.date) - Number(objB.date),
);

// 👇️ {id: 3, date: Thu Feb 24 2022,
//     id: 2, date: Fri Feb 24 2023
//     id: 5, date: Wed Feb 24 2027}
console.log(sortedAsc);

2每次迭代时，都会调用数组中的元素（对象）调用该函数。

该sort()方法使用以下逻辑对数组中的元素进行排序：

如果比较函数的返回值大于0，则b
先排序a。
如果比较函数的返回值小于，则
先0排序。ab
如果比较函数的返回值等于0，则保持原先的顺序a和b。

# 按日期属性降序排列对象数组

要按日期属性按降序对对象数组进行排序，只需从第二个日期的时间戳中减去第一个日期的时间戳。

索引.js


const arr1 = [
  {id: 3, date: new Date(2022, 1, 24)},
  {id: 5, date: new Date(2027, 1, 24)},
  {id: 2, date: new Date(2023, 1, 24)},
];

// ✅ Sort in Descending order (high to low)
const sortedDesc = arr1.sort(
  (objA, objB) => Number(objB.date) - Number(objA.date),
);

//  👇️ {id: 5, date: Wed Feb 24 2027,
//      id: 2, date: Fri Feb 24 2023,
// ️     id: 3, date: Thu Feb 24 2022}
console.log(sortedDesc);

// 👇️ 1645454934750
console.log(new Date().getTime());

额外资源

您可以通过查看以下教程来了解有关相关主题的更多信息：