为数组中的每个元素添加属性/索引

Question

我调用一个返回对象数组的webservice：

$.ajax({
  dataType: "json",
  url: "WebServices/FetchMenu.aspx?P=0&L=2&mt=1",
  //data: data,
  success: function (data) {
    var foo = data;
  }
});

这是响应：

[
    {
        color: "red",
        value: "#f00"
    },
    {
        color: "green",
        value: "#0f0"
    },
    {
        color: "blue",
        value: "#00f"
    },
    {
        color: "cyan",
        value: "#0ff"
    }
]

我希望为每个包含当前元素在数组中的索引的元素添加一个属性row_number。

我需要这样做是因为我稍后会更改元素的顺序，但希望能够识别元素的原始位置。

- Ali

---

“行号”是什么意思？您有一个结果集，并且想要为每一行添加附加属性？ - Kristian Vitozev

你能提供一个数据示例和你期望的结果吗？你到目前为止尝试了什么？ - Felix Kling

@Felix Kling：这是一个简单的JSON变量...主要问题是，如果我在foo中进行移位并推入一些元素，数组的顺序会改变，并且在运行该代码后，原来在foo中的第一个元素现在成为了最后一个元素。 - Ali

所以你不想给 foo 添加一个属性，而是要给 foo 中的所有对象添加属性？还是只给第一个对象添加属性？举个例子会更清楚。 - Felix Kling

我重新表述了问题，以便其他访问者也能从中获得更多价值。 - Felix Kling

Answer 1

没有什么特别需要做的。只需遍历数组并将属性添加到每个元素中：

for (var i = 0; i < foo.length; i++) {
  foo[i].row_number = i;
}

// or with forEach

foo.forEach(function(row, index) {
  row.row_number = index;
});

请参考Access / process (nested) objects, arrays or JSON，了解JavaScript中嵌套数据结构的更一般信息。

- Felix Kling

---

JS的ForEach非常低效。请改用下面的数组映射答案。 - Nafiu Lawal

@NafiuLawal：你是怎么得出它不高效的结论的？表面上看，使用map解决方案似乎不太高效，因为它会为每个元素创建一个新对象。当然，想要复制数据而不是改变现有数据也有合理的原因。 - Felix Kling

@felixKing，对于这种情况来说，它是低效的，因为他正在更改数组。在这种情况下，使用map解决方案是更有效的解决方案。我知道下面这篇文章的作者不是权威人士，但他在这里表达得比我好。https://morioh.com/p/b2d058745cb8 - Nafiu Lawal

Answer 2

如果您希望保留旧对象，或者想在调用链中进行操作而不修改现有数组，则可以使用 map 方法。

const oldArray = [{a: 'Andy'}, {b: 'Betty'}, {c: 'Charlie'}];
const newArray = oldArray.map((item, index) => ({index, ...item}));
console.log(newArray);
// Array [Object { index: 0, a: "Andy" }, Object { index: 1, b: "Betty" }, Object { index: 2, c: "Charlie" }]

- darkhipo

Answer 3

如果foo是一个对象，你可以这样做：

foo.Row_Number

如果是列表，您可以使用$.each并为每个对象执行相同的操作。

$.each(obj, function (index) {
    this.row_number = index + 1;
});

- Arash R

---

如果我运行代码foo.push(foo.shift());，那么foo将会移动并推送项目，而foo.Row_Number每次调用该代码时都会发生变化...那么这不是解决方案。 - Ali

Answer 4

let index = 0;
items.forEach((item) => (item.index = index++));

- Vlad Nussem