根据数组中对象的数量改变id (javascript/jquery)

Change id according to the number of objects in an array (javascript/jquery)

本文关键字：id javascript jquery 改变 数组 对象      更新时间：2023-09-26

我可以在表单中插入"name"， "姓"，"age"，然后将它们打印在表单下面的表格中。

每当我添加一个用户时，我都会添加一行，并将每个信息推送到数组中。

我有一个名为"idUser"的变量，我用它来给每一行一个唯一的id:第一行id=0，第二行id=1，第三行id=2等，所以每次我增加"idUser"变量，我把它分配给新行。

然后我可以编辑和删除每一行，但我不知道如何解决一个问题:例如，我有3个用户，所以我打印

idUser=0 name surname age edit delete
idUser=1 name surname age edit delete
idUser=2 name surname age edit delete

这个数组有3个元素

[{
"id": 0,
"name": name,
"surname": surname,
"age": age
},
{
"id": 1,
"name": name,
"surname": surname,
"age": age
},
{
"id": 2,
"name": name,
"surname": surname,
"age": age
},
]

如果我删除第一行，我同时删除数组中的第一个元素。所以现在的情况是:

idUser=1 name surname age edit delete
idUser=2 name surname age edit delete

和数组

[{
"id": 1,
"name": name,
"surname": surname,
"age": age
},
{
"id": 2,
"name": name,
"surname": surname,
"age": age
},
]

所以我有很多问题:如果我添加一个新用户，"idUser"增量所以我将有一个新的行id=3

idUser=1 name surname age edit delete
idUser=2 name surname age edit delete
idUser=3 name surname age edit delete

，但如果我想编辑行idUser=3，我有一个错误，因为我从数组中获取信息，并将它们复制到表单字段中(所以我可以在表单中编辑它们)，但数组只有3个元素(我要求第四个元素，因为idUser=3，所以数组中的第四个元素)....我还应该改变数组中每个对象的id(第一个位置[0]的对象必须是id:0，第二个对象id:1)。所以当我删除一些东西时，我需要更新数组中所有对象的id，每一行的id以及变量"idUser"。我不知道如何同时更新所有这些东西。这不是代码的问题，我只是需要一个想法来解决它，我应该如何处理id和变量"idUser"

您将id属性用作索引，当您从数据数组中删除元素时，它将不再工作。当一个项目被删除后，我将不修改所有的数据点，而是做以下两件事之一:

  • 创建通过id
    • 引用用户的Map或object
  • 创建一个函数，根据数组中的id查找用户对象。

对于大型数据集，我会选择选项1。但是对于小数组，您也可以像这样使用Array.prototype.find:

function getObjWithKeyValue(arr, key, value) {
   return arr.find(function(item) {
     return item[key] === value;
   });
};
                   
var data =  [{id:1,name:"",surname:"",age:""},{id:2,name:"",surname:"",age:""}];
var personWithId1 = getObjWithKeyValue(data, "id", 1);
console.log(personWithId1);

另一种方法，如果你感兴趣的话: 

var data =  [{id:1,name:"",surname:"",age:""},{id:2,name:"",surname:"",age:""}];
var dataMap = data.reduce(function(map, d) {
  map[d.id] = d;
  return map;
}, {});
var userWithId1 = dataMap[1];
console.log(userWithId1);

相关文章：