在JavaScript中，虽然对象（Object）本身通常不保证键的顺序（尽管现代引擎对非数字键通常会保留插入顺序），但在某些场景下，我们可能需要根据特定的逻辑来“排序”对象的键。这通常意味着创建一个新的对象，其键的顺序符合我们的要求。以下我们将通过一个具体的函数sortWeekFunction来深入理解这一过程。
核心概念：排序对象的键
首先需要明确，“排序一个对象”的本质是排序该对象的键。JavaScript中的对象（Object）和映射（Map）是不同的数据结构。对象通常不被视为有序集合，而Map则会保留键的插入顺序。当我们需要对对象的键进行排序时，通常会涉及以下步骤：
- 将对象的键值对提取出来。
- 对这些键值对进行排序。
- 根据排序后的键值对重新构建一个新的对象。
示例代码解析
我们来看一个具体的例子，该函数旨在根据一个参照数组weeksArr的顺序来排序weeksObj的键。
const weeksArr = ['sunday', 'monday', 'wednesday', 'thursday', 'friday'];
const weeksObj = {
wednesday: 'wednesday',
friday: 'friday',
monday: 'monday',
thursday: 'thursday',
sunday: 'sunday',
};
const sortWeekFunction = (array, object) => {
// 步骤1: 将对象转换为键值对数组
// Object.entries(object) 返回一个数组，其中包含对象所有可枚举的字符串键属性的 [key, value] 对。
// new Map(...) 从这个键值对数组创建一个 Map 对象。
// Array.from(newMapSortObj) 将 Map 对象转换为一个数组，其元素是 [key, value] 对。
// 这一步实际上等同于直接使用 Array.from(Object.entries(object))，因为 Map 在这里主要用于中间转换。
const newMapSortObj = new Map(Object.entries(object));
const entriesArray = Array.from(newMapSortObj);
/*
此时 entriesArray 的内容大致如下（顺序可能不固定，取决于原始对象的插入顺序）：
[
['wednesday', 'wednesday'],
['friday', 'friday'],
['monday', 'monday'],
['thursday', 'thursday'],
['sunday', 'sunday']
]
*/
// 步骤2: 对键值对数组进行排序
// 使用 Array.prototype.sort() 方法，并提供一个自定义的比较函数。
const sortObj = entriesArray.sort(
(a, b) => array.indexOf(a[0]) - array.indexOf(b[0])
);
/*
比较函数的逻辑：
- a 和 b 是 entriesArray 中的两个元素，例如 a = ['wednesday', 'wednesday']，b = ['sunday', 'sunday']。
- a[0] 和 b[0] 分别是键，即 'wednesday' 和 'sunday'。
- array.indexOf(a[0]) 查找键在参照数组 `weeksArr` 中的索引。
- weeksArr.indexOf('sunday') 返回 0。
- weeksArr.indexOf('monday') 返回 1。
- weeksArr.indexOf('wednesday') 返回 2。
- weeksArr.indexOf('thursday') 返回 3。
- weeksArr.indexOf('friday') 返回 4。
- 比较结果：
- 如果 `array.indexOf(a[0]) - array.indexOf(b[0])` 为负值，表示 `a` 应该排在 `b` 之前。
- 如果为正值，表示 `b` 应该排在 `a` 之前。
- 如果为零，表示相对顺序不变。
例如，比较 ['sunday', ...] 和 ['wednesday', ...]:
array.indexOf('sunday') (0) - array.indexOf('wednesday') (2) = -2。
因为结果是负数，所以 ['sunday', ...] 会排在 ['wednesday', ...] 之前。
通过这种方式，数组最终会按照 `weeksArr` 的顺序排列。
*/
// 步骤3: 将排序后的键值对数组重新转换为对象
// Object.fromEntries() 方法接收一个由键值对组成的数组，并返回一个新对象。
return Object.fromEntries(sortObj);
};
console.log(sortWeekFunction(weeksArr, weeksObj));
// 预期输出：
// {
// sunday: 'sunday',
// monday: 'monday',
// wednesday: 'wednesday',
// thursday: 'thursday',
// friday: 'friday',
// }工作原理总结
- 提取键值对： Object.entries(object) 将原始对象转换为一个包含所有键值对的数组，例如 [['key1', 'value1'], ['key2', 'value2']]。
- 转换为可排序结构： 虽然示例中使用了 new Map() 和 Array.from()，但更直接的方式是直接对 Object.entries(object) 返回的数组进行操作，因为它本身就是一个可排序的数组。
- 自定义排序： Array.prototype.sort() 方法被用来对键值对数组进行排序。其核心在于比较函数 (a, b) => array.indexOf(a[0]) - array.indexOf(b[0])。这个函数通过查找每个键（a[0]或b[0])在参照数组array中的位置来决定它们的相对顺序。键在参照数组中位置越靠前，其索引值越小，在排序后的结果中也会越靠前。
- 重构对象： Object.fromEntries(sortObj) 将排序后的键值对数组转换回一个新的对象。这个新对象的键的顺序将与参照数组的顺序一致。
注意事项与性能考量
-
对象的键序： 尽管此方法可以生成一个键有序的新对象，但请记住，在大多数情况下，JavaScript普通对象的键顺序在语义上并不重要。如果你的应用逻辑严格依赖于键的顺序，Map数据结构可能是更合适的选择，因为它明确保证了键的插入顺序。
立即学习“Java免费学习笔记（深入）”；
-
indexOf的性能： 在排序函数的比较逻辑中频繁调用 array.indexOf() 可能会导致性能问题，尤其是在参照数组array非常大或者需要排序的对象键非常多的情况下。indexOf方法每次调用都需要遍历参照数组来查找元素，这在sort的O(N log N)复杂度中又引入了一个O(M)的复杂度（M为参照数组长度），使得总复杂度变为O(N log N * M)。
- 优化建议： 如果性能是一个关键因素，可以考虑在排序之前创建一个从键到其在参照数组中索引的映射（例如，使用一个Map或另一个对象），这样在比较函数中查找索引就变成了O(1)操作，从而将总复杂度降低到O(N log N)。
const sortWeekFunctionOptimized = (array, object) => { const keyToIndexMap = new Map(); array.forEach((key, index) => { keyToIndexMap.set(key, index); }); const entriesArray = Object.entries(object); const sortObj = entriesArray.sort( (a, b) => (keyToIndexMap.get(a[0]) || Infinity) - (keyToIndexMap.get(b[0]) || Infinity) ); // 使用 || Infinity 是为了处理对象中存在但参照数组中不存在的键，确保它们排在最后。 return Object.fromEntries(sortObj); }; 键的缺失： 如果对象中存在某个键，但在参照数组中不存在，那么 array.indexOf() 将返回 -1。这会导致这些键在排序结果中被排到最前面（因为 -1 是最小的索引值）。根据需求，你可能需要调整比较函数来处理这种情况，例如将它们排到最后。
总结
通过上述解析，我们理解了如何利用JavaScript的数组和对象方法，结合自定义排序逻辑，实现根据参照数组对对象键进行排序的功能。这种技术在需要特定数据展示顺序或处理配置对象时非常有用。同时，我们也强调了性能优化的重要性，特别是在处理大量数据时，预先构建索引映射可以显著提升效率。
