
本文详细介绍了如何在 typescript 中对对象数组进行多属性级联排序。通过构建一个通用函数,我们首先展示了如何基于指定属性键序列进行默认比较排序,然后进一步扩展该功能,允许为特定属性提供自定义比较器,从而实现灵活且类型安全的复杂排序逻辑。
在前端或后端数据处理中,经常需要对包含多个属性的对象数组进行排序。当需要按照一个属性排序,如果该属性值相等,则继续按照第二个属性排序,依此类推,这就构成了多属性级联排序的需求。TypeScript 提供了强大的类型系统,使得我们能够构建既灵活又类型安全的通用排序函数。
级联排序的核心思想是:遍历一个预定义的属性优先级列表。对于列表中的每个属性,比较两个待排序对象在该属性上的值。
首先,我们来构建一个基本的 sortByKeys 函数,它接受一个对象数组和一组用于排序的属性键。这个版本将使用 JavaScript 的默认比较操作符 (<, >) 来进行比较。
interface Item {
a: string;
b: number;
c: Date;
}
/**
* 根据指定的属性键序列对数组进行级联排序。
* @param items 待排序的对象数组。
* @param keys 优先级从高到低的属性键数组。
*/
function sortByKeys<T>(items: T[], keys: (keyof T)[]): void {
items.sort((item1, item2) => {
for (const key of keys) {
const v1 = item1[key];
const v2 = item2[key];
// 如果值不相等,则根据当前属性决定顺序
if (v1 < v2) return -1;
if (v2 < v1) return 1;
}
// 所有属性都相等,保持原始顺序
return 0;
});
}
// 示例用法
const items: Item[] = [
{ a: 'aa', b: 1, c: new Date('2023-01-03') },
{ a: 'a', b: 2, c: new Date('2023-01-01') },
{ a: 'a', b: 1, c: new Date('2023-01-02') },
{ a: 'ab', b: 1, c: new Date('2023-01-04') },
];
console.log('原始数组:', JSON.parse(JSON.stringify(items))); // 深拷贝,避免原始数组被修改影响后续示例
// 示例1: 优先按 'b' 排序,然后按 'a' 排序
sortByKeys(items, ['b', 'a']);
console.log('按 b, a 排序:', items);
/*
输出示例:
[
{ a: 'a', b: 1, c: Date },
{ a: 'aa', b: 1, c: Date },
{ a: 'ab', b: 1, c: Date },
{ a: 'a', b: 2, c: Date }
]
*/
// 示例2: 优先按 'a' 排序,然后按 'b' 排序
const items2: Item[] = [
{ a: 'aa', b: 1, c: new Date('2023-01-03') },
{ a: 'a', b: 2, c: new Date('2023-01-01') },
{ a: 'a', b: 1, c: new Date('2023-01-02') },
{ a: 'ab', b: 1, c: new Date('2023-01-04') },
];
sortByKeys(items2, ['a', 'b']);
console.log('按 a, b 排序:', items2);
/*
输出示例:
[
{ a: 'a', b: 1, c: Date },
{ a: 'a', b: 2, c: Date },
{ a: 'aa', b: 1, c: Date },
{ a: 'ab', b: 1, c: Date }
]
*/代码解析:
这种基本实现适用于大多数基本数据类型(如字符串、数字)的默认升序比较。
在某些情况下,默认的 < 和 > 比较操作可能不满足需求。例如,日期对象需要更精确的比较,或者字符串需要进行不区分大小写的比较,或者存在特定的业务逻辑需要自定义比较规则。为了支持这些场景,我们可以扩展 sortByKeys 函数,使其能够接受自定义比较器。
interface Item {
a: string;
b: number;
c: Date;
}
/**
* 自定义比较器类型,返回 -1 (v1 < v2), 0 (v1 == v2), 或 1 (v1 > v2)。
*/
type CustomSorter<V> = (value1: V, value2: V) => -1 | 0 | 1;
/**
* 根据指定的属性键序列和可选的自定义比较器对数组进行级联排序。
* @param items 待排序的对象数组。
* @param keys 优先级从高到低的属性键数组。
* @param customSorters 一个对象,键是属性名,值是该属性的自定义比较器。
*/
function sortByKeys<T>(
items: T[],
keys: (keyof T)[],
customSorters: Partial<{ [key in (keyof T)]: CustomSorter<T[key]> }> = {}
): void {
items.sort((item1, item2) => {
for (const key of keys) {
const v1 = item1[key];
const v2 = item2[key];
const customSorter = customSorters[key];
if (customSorter) {
// 如果存在自定义比较器,则使用它
const result = customSorter(v1 as T[typeof key], v2 as T[typeof key]);
if (result !== 0) return result;
} else {
// 否则使用默认比较
if (v1 < v2) return -1;
if (v2 < v1) return 1;
}
}
return 0;
});
}
// 辅助函数生成随机日期
const randomDate = () => new Date(Date.now() + Math.floor(Math.random() * 1000000));
const itemsWithDates: Item[] = [
{ a: 'aa', b: 1, c: new Date('2023-01-03T10:00:00Z') },
{ a: 'a', b: 2, c: new Date('2023-01-01T12:00:00Z') },
{ a: 'a', b: 1, c: new Date('2023-01-02T14:00:00Z') },
{ a: 'ab', b: 1, c: new Date('2023-01-04T08:00:00Z') },
];
console.log('\n原始带日期数组:', JSON.parse(JSON.stringify(itemsWithDates)));
// 示例3: 优先按 'c' (日期) 排序,使用自定义日期比较器
sortByKeys(itemsWithDates, ['c'], {
'c': (date1: Date, date2: Date) => {
if (date1 < date2) return -1;
if (date2 < date1) return 1;
return 0;
},
});
console.log('按 c (自定义日期) 排序:', itemsWithDates);
/*
输出示例:
[
{ a: 'a', b: 2, c: Date('2023-01-01T12:00:00.000Z') },
{ a: 'a', b: 1, c: Date('2023-01-02T14:00:00.000Z') },
{ a: 'aa', b: 1, c: Date('2023-01-03T10:00:00.000Z') },
{ a: 'ab', b: 1, c: Date('2023-01-04T08:00:00.000Z') }
]
*/
// 示例4: 优先按 'a' (字符串,不区分大小写),然后按 'b' (数字) 排序
const itemsCaseInsensitive: Item[] = [
{ a: 'Apple', b: 2, c: randomDate() },
{ a: 'banana', b: 1, c: randomDate() },
{ a: 'apple', b: 1, c: randomDate() },
{ a: 'Banana', b: 3, c: randomDate() },
];
console.log('\n原始不区分大小写数组:', JSON.parse(JSON.stringify(itemsCaseInsensitive)));
sortByKeys(itemsCaseInsensitive, ['a', 'b'], {
'a': (str1: string, str2: string) => {
const s1 = str1.toLowerCase();
const s2 = str2.toLowerCase();
if (s1 < s2) return -1;
if (s2 < s1) return 1;
return 0;
},
});
console.log('按 a (不区分大小写), b 排序:', itemsCaseInsensitive);
/*
输出示例:
[
{ a: 'apple', b: 1, c: Date },
{ a: 'Apple', b: 2, c: Date },
{ a: 'banana', b: 1, c: Date },
{ a: 'Banana', b: 3, c: Date }
]
*/代码解析:
通过上述方法,我们可以在 TypeScript 中灵活、高效且类型安全地实现对象数组的多属性级联排序,无论是简单的默认比较,还是复杂的自定义比较逻辑,都能得到优雅的解决方案。
以上就是TypeScript 中实现对象数组的多属性级联排序的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号