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

Posted 2023-05-09

【中文标题】根据数组中对象的数量更改 id (javascript/jquery)

【英文标题】：Change id according to the number of objects in an array (javascript/jquery)

【发布时间】：2017-03-01 14:08:36

【问题描述】：

我可以在表格中插入“姓名”、“姓氏”、“年龄”，然后将它们打印在表格下方的表格中。

每次添加用户时，我都会追加一行并将所有信息推送到数组中。

我有一个名为“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，所以数组中的第 4 个元素）....我也应该更改数组中每个对象的 id（第一个位置 [0] 中的对象必须有 id:0，第二个对象 id:1)。因此，当我删除某些内容时，我需要更新数组中所有对象的 id、每行中的 id 以及变量“idUser”..Idk 如何同时更新所有这些东西..这不是问题代码，我只需要一个想法来解决它以及我应该如何处理 id 和变量“idUser”

【问题讨论】：

不要尝试通过 id 访问行，而是尝试将 id 添加到编辑链接上的 data- 属性或使用点击处理程序中的遍历函数：var recordId = $(this).closest('tr').find('.record-id').val();

但是如果我不使用 id，如何从数组中获取数据？我想要 id 因为我可以使用它从数组中的特定位置提取数据......这就是为什么我考虑增量变量“idUser”

【参考方案1】：

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

创建一个Map 或object，通过id 引用用户 创建一个函数，通过数组中的 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);