维护地图函数中项目的顺序：Javascript

Question

我正在尝试使用地图更改其中一个字段名称，但我发现项目的顺序正在发生变化。

var arrOfObj = [
  {
    name: "test1",
    value: "value1"
  },
  {
    name: "test2",
    value: "value2"
  }
];

function changeKeyName(arr, oldValue, newVal) {
  return arr.map(item => {
    item[`${newVal}`] = item[`${oldValue}`];
    delete item[`${oldValue}`];
    return item;
  });
}

console.log(changeKeyName(arrOfObj, "name", "type"));

有什么方法可以在更改其中一个字段名称的同时保持项目的顺序。

O/P:

[{type:"test1",value: "value1"}, {type: "test2", value:"value2"}]

提前致谢

Answer 1

您可以使用 Object.entries 获取条目数组，然后映射它们，找到时用新密钥替换旧密钥：

var arrOfObj = [
  {
    name: "test1",
    value: "value1"
  },
  {
    name: "test2",
    value: "value2"
  }
];

const changeKeyName = (arr, oldKey, newKey) => arr.map(
  item => Object.fromEntries(
    Object.entries(item).map(
      ([key, val]) => [key === oldKey ? newKey : key, val]
    )
  )
);
console.log(changeKeyName(arrOfObj, "name", "type"));

（与流行的看法相反，对象属性顺序是保证 by the specification，并且已在所有环境中实施多年。但请记住这仅适用于不是数组索引的键 - 像 0 1 2 这样的数组索引不能相对于其他索引排序属性，它们总是首先被迭代，按数字升序）

就是说，如果编写代码时属性顺序无关紧要，代码通常更容易理解 - 如果您的代码依赖于特定顺序的属性，我建议重构这样属性顺序就无关紧要了。

Answer 2

map 在这里使用不正确，因为您应该始终 return 一组新的结果。

您可以这样做，您可以根据需要更改顺序：

const arrOfObj = [
  {
    name: "test1",
    value: "value1"
  },
  {
    name: "test2",
    value: "value2"
  }
];

function changeKeyName(arr, oldValue, newVal) {
  return arr.map(({ [oldValue]: val, ...rest }) => {
    return {
      [newVal]: val,
      ...rest,
    };
  });
}

console.log(changeKeyName(arrOfObj, "name", "type"));

维护地图函数中项目的顺序：Javascript

Maintaining order of items in the map function: Javascript

javascript

arrays

ecmascript-5

ecmascript-6