JS 배열 개체 - 날짜 개체별 정렬, 시간별 오름차순 또는 내림차순 정렬
장면 반복
정렬은 프로젝트에서 매우 실용적이며 특히 대량의 데이터를 표시, 처리 및 운영 해야 하는 백그라운드 관리 시스템 에서 매우 자주 발생합니다 . 일반적으로백그라운드에서 배열 객체 가져오기,그 다음에속성 중 하나에 따라 데이터를 오름차순 또는 내림차순으로 정렬처리. 이 기사에서 시작하여 일반적으로 사용되는 세 가지 정렬을 소개합니다.날짜순 정렬、중국어 이니셜로 정렬、영어의 첫 글자에 따라 정렬. 이 세 종류는 매우 자주 사용됩니다.
다음은 자세한 예를 제공합니다.날짜 및 시간별로 정렬!
배열 객체에 대한 정렬 방법을 캡슐화합니다.
캡슐화 아이디어는 프로젝트에서 많이 사용되며 좋은 캡슐화는 코드의 양을 크게 줄이고 재사용률을 높일 수 있습니다.
먼저 가장 간단한 것을 이해합시다숫자 크기에 따른 정렬 방법캡슐화.
// 封装数组对象排序方法
compare(prop) {
return function(a, b) {
return b[prop] - a[prop] // 降序
// return a[prop] - b[prop] // 升序
}
},
// 比如arrList对象中根据score属性进行从大到小的排序
const arrList = [
{
id: 1, value : "value1", score: 97},
{
id: 2, value : "value2", score: 126, },
{
id: 3, value : "value3", score: 60, },
];
arrList = arrList.sort(arrList.compare('score'))
큰 것부터 작은 것까지 정렬된 데이터:
{
id: 2, value : "value2", score: 126, },
{
id: 1, value : "value1", score: 97},
{
id: 3, value : "value3", score: 60, },
이 간단한 크기 정렬을 읽은 후 포인트로 이동하여 날짜별로 정렬해 보겠습니다.
여기서는 시간 및 날짜 혼합 정렬(하나의 매개변수에 있는 시간과 날짜) 및 시간과 날짜를 별도로 정렬(시간과 날짜는 두 개의 매개변수에 해당합니다.)
날짜 및 시간 개체별로 정렬
1. 날짜와 시간에 따른 혼합 정렬
(1) 배열 내용
let data = [
{
id: 2, time: '2019-04-26 10:53:19'},
{
id: 4, time: '2019-04-26 10:51:19'},
{
id: 1, time: '2019-04-26 11:04:32'},
{
id: 3, time: '2019-04-26 11:05:32'}
]
(2)Date.parse()를 사용한 날짜 혼합 정렬
// property是你需要排序传入的key,bol为true时是升序,false为降序
function dateData(property, bol) {
return function(a, b) {
var value1 = a[property];
var value2 = b[property];
if (bol) {
// 升序
return Date.parse(value1) - Date.parse(value2);
} else {
// 降序
return Date.parse(value2) - Date.parse(value1)
}
}
}
console.log(data.sort(dateData("time", true)))
console.log(data.sort(dateData("time", false)))
콘솔 정렬 결과:
다음은 날짜 및 시간 매개변수를 별도로 정렬한 예입니다.
2. 날짜와 시간별로 각각 정렬
1. 오름차순
1. 배열 내용
const arr = [
{
id: 1, value : "value1", date: "2018-08-08", time: "15:27:17"},
{
id: 2, value : "value2", date: "2018-08-09", time: "12:27:17"},
{
id: 3, value : "value3", date: "2018-08-10", time: "17:27:17"},
{
id: 4, value : "value4", date: "2018-08-10", time: "01:27:17"},
{
id: 5, value : "value5", date: "2018-08-10", time: "09:27:17"},
{
id: 6, value : "value6", date: "2018-08-10", time: "23:27:17"},
{
id: 7, value : "value7", date: "2018-08-10", time: "16:27:17"},
{
id: 8, value : "value8", date: "2018-08-11", time: "10:27:17"}
];
방법 :종류()、로케일 비교()
- sort는 정렬에 사용되고, localeCompare는 비교에 사용됩니다.
localeCompare는 localCompare로 작성하면 안 됩니다.
2,키 코드: ( 시간 및 날짜별로 정렬 )
// 按照时间先后顺序进行排序
arr.sort((a, b) => a.date.localeCompare(b.date) || a.time.localeCompare(b.time));
console.log(arr);
// 包括了时间的比较,同时也包括了日期的比较
삼,콘솔 정렬 결과:
둘, 내림차순
내림차순은 a와 b의 위치만 바꾸면 됩니다., 아래와 같이 코드 쇼:
arr.sort((a, b) => b.date.localeCompare(a.date) || b.time.localeCompare(a.time));
console.log(arr);
콘솔 정렬 결과: