将值添加到对象数组中

Question

我在 UI 表上显示了这个对象数组。它有 3 列，分别为 name、contact 和 id。

[Object, Object, Object]
0:Object
    name: "Rick"
    Contact: "Yes"
    id: 1
1:Object
    name:"Anjie"
    Contact:"No"
    id: 2
2:Object
    name:"dillan"
    Contact:"Maybe"
    id:3

现在，我在表格顶部添加一个新行。因此，新添加到对象数组中的行将如下所示。

[Object, Object, Object,Object]
0:Object  //newly added row. Since new row is added, it doesnt have any data.
 name: ""
 Contact: ""
 id: 
1:Object
 name: "Rick"
 Contact: "Yes"
 id: 1
2:Object
 name:"Anjie"
 Contact:"No"
 id: 2
3:Object
 name:"dillan"
 Contact:"Maybe"
 id:3

我希望对象数组看起来像这样，而不是上面一个。

[Object, Object, Object,Object]
0:Object  //newly added row. Since new row is added, it doesnt have any data.
 name: ""
 Contact: ""
 id: 4        
1:Object
 name: "Rick"
 Contact: "Yes"
 id: 1
2:Object
 name:"Anjie"
 Contact:"No"
 id: 2
3:Object
 name:"dillan"
 Contact:"Maybe"
 id:3

唯一的变化是第 0 个对象的 id 值。您可以看到我将其输入为 4。它将检查对象数组中的最大值以获取 id。在这种情况下，它是 3。因此它将增加 1，并将其作为新添加行的 id 值。

请有人告诉我如何实现这一点。

另外，我还有一个问题。

如果我的 id 值如下。

1
2
3
4
5
6

我删除了 4 和 5。所以新的行将是

1
2
5
6

在这里，它将检查最大长度为 4 并将 id 值 5 添加到新行。它看起来有点像这样。

5
1
2
5
6

在这种情况下，重复 5。我不想要这个。相反，我想看看哪个是赋予 id 的最高值，然后根据它增加 id。所以它应该看起来像这样。

7
1
2
5
6

Answer 1

如果我理解正确，你只是想运行：

array[0].id = array.length;

添加行后立即。或者，如果您可以在添加新行时控制表示新行的对象的值，您可以将行添加为：

{
  name:"",
  Contact:"",
  id: array.length + 1
}

编辑：

响应您的编辑，显示可以删除数组的行。

在这种情况下，要获取 ID 值，您有多种选择。

一种是在删除时遍历数组的所有成员，并减少所有id大于删除行的行的id。这可能是最好的解决方案。

示例代码：

var delete = function(array, idToDelete) {
  for(var i = 0; i < array.length; i += 1) {
    if(array[i].id === idToDelete) {
      array.splice(i, 1);
    } else if (array[i].id > idToDelete) {
      array[i].id = array[i].id - 1;
    }
  }
}

如果出于某种原因，这不是一个选项，我建议遍历数组以找到其中的最高 ID，然后添加 1。

var newId = array[0].id;
for(var i = 0; i < array.length; i += 1) {
  if(array[i].id > newId) {
    newId = array[i].id;
  } 
}
array.splice(0, 0, {name:"", Contact:"", id: newId + 1});

Answer 2

您可以使用它来查找下一个可用的最高 ID（假设它并非总是等于数组的长度）：

var newID = 1 + myArray.reduce(function(p, c) {
    return Math.max(c.id, p);
}, 0);

myArray 是你的数组。

在 ES6 中你可以使用：

var newID = 1 + myArray.reduce((p, c) => Math.max(c.id, p), 0)

Answer 3

如果只关心 ID 的唯一性，可以添加时间戳作为 ID

假设您的数组名为peopleContact 您在对象数组中添加项目的代码如下所示。

var person= new Object();
person.name= "";
person.Contact= "";
person.id = Date.now();

peopleContact.push(person);