如何依据指定数组的键位置排序对象数组的键顺序

给定指定键顺序的数组：

let arr1 = ['name', 'age', 'occupation', 'address']

以及后端返回的未排序对象数组：

let arr2 = [{'age': 20, 'address': '', 'occupation': 'student', 'name': 'student name1'}, {'age': 21, 'address': '', 'occupation': 'student', 'name': 'student name2'}, {'age': 22, 'address': '', 'occupation': 'student', 'name': 'student name3'}]

需要将arr2中每个对象的键按照arr1的索引位置排序，得到如下结果：

let arr2Sorted = [{ 'name': 'student name1', 'age': 20, 'occupation': 'student', 'address': ''}, { 'name': 'student name2', 'age': 21, 'occupation': 'student', 'address': ''}, { 'name': 'student name3', 'age': 22, 'occupation': 'student', 'address': ''}]

当前代码的问题 #

你尝试的代码逻辑错误：reduce中把每个对象直接作为键名存入arrayMap，这无法实现按指定顺序重构对象的需求，最终map得到的结果也不是预期的排序后对象数组。

正确解法 #

方法一：使用reduce构建排序后的对象 #

遍历arr2中的每个对象，针对每个对象，按arr1的键顺序，通过reduce重新构建新对象：

const arr2Sorted = arr2.map(obj => {
  return arr1.reduce((sortedObj, key) => {
    sortedObj[key] = obj[key];
    return sortedObj;
  }, {});
});

方法二：使用Object.fromEntries简化写法 #

利用Object.fromEntries将键值对数组转为对象，写法更简洁：

const arr2Sorted = arr2.map(obj => 
  Object.fromEntries(arr1.map(key => [key, obj[key]]))
);

两种方法都会生成键顺序与arr1完全一致的新对象数组，符合预期输出。

内容的提问来源于stack exchange，提问作者Learn to code