TypeScript中如何按指定规则调整数组内对象的键顺序？

ES2015及之后的标准明确规定了对象字符串键的遍历顺序为键的插入顺序，所以只要按你指定的顺序重新构建对象，就能得到固定键序的结果，不需要引入额外依赖。

实现代码 #

// 在这里按你需要的先后顺序填写键名即可
const CUSTOM_KEY_ORDER = ['id', 'name', 'email', 'createdAt', 'updatedAt'] as const;

/**
 * 重排单个对象的键顺序
 * @param source 原始对象
 * @param keyOrder 自定义键优先级顺序
 * @param keepRestKeys 是否保留不在自定义顺序里的键，默认保留并追加到末尾
 */
function reorderObjKeys<T extends Record<string, unknown>>(
  source: T,
  keyOrder: readonly string[],
  keepRestKeys = true
): T {
  // 筛选出自定义顺序中存在于当前对象的键
  const sortedKeys = keyOrder.filter((key) => Object.prototype.hasOwnProperty.call(source, key));
  // 收集剩余未指定顺序的键
  const restKeys = keepRestKeys
    ? Object.keys(source).filter((key) => !keyOrder.includes(key))
    : [];
  // 按顺序拼接后构建新对象
  return [...sortedKeys, ...restKeys].reduce((result, key) => {
    (result as Record<string, unknown>)[key] = source[key];
    return result;
  }, {} as T);
}

/**
 * 批量重排对象数组内所有元素的键顺序
 */
function reorderArrayObjKeys<T extends Record<string, unknown>>(
  sourceArr: T[],
  keyOrder: readonly string[],
  keepRestKeys = true
): T[] {
  return sourceArr.map((item) => reorderObjKeys(item, keyOrder, keepRestKeys));
}

使用方式 #

// 模拟数据库返回的键序混乱的原始数据
const dbRawData = [
  {
    email: "user1@test.com",
    updatedAt: "2024-06-01",
    id: 1,
    name: "用户1",
    createdAt: "2024-01-01",
    role: "user"
  },
  {
    createdAt: "2024-02-01",
    id: 2,
    role: "admin",
    email: "user2@test.com",
    name: "用户2",
    updatedAt: "2024-06-02"
  }
];

// 执行重排
const sortedData = reorderArrayObjKeys(dbRawData, CUSTOM_KEY_ORDER);

重排后每个对象的键顺序固定为：id → name → email → createdAt → updatedAt → role，未在自定义顺序里的role会自动追加到末尾。 #

注意事项 #

• 整个处理过程不会修改原始数组和原始对象，返回的是一层新副本，无副作用
• 如果不需要保留自定义顺序外的键，调用时第三个参数传false即可
• 如果需要处理嵌套对象的键序，在reorderObjKeys内增加值类型判断，对普通对象类型的值递归调用重排方法即可
• 最终返回结果的TS类型和原始数据保持一致，不会丢失类型提示

内容的提问来源于stack exchange，提问作者Vishal