在数组中动态创建新元素并更新所有后续元素的 ID

Question

我正在研究基于时间线的日记/日记，其中有一组 JS 对象表示单个条目。每个对象都有一个基于其在数组中的位置的 ID。问题是我希望能够将一个条目插入到数组中的特定位置，然后更新所有条目的 ID 以匹配它们在数组中的新位置。 Figure 1

图 1：数组中有两个 ID 为 0 和 1 的条目。我单击第二个条目（id 1）中的按钮以在该条目之前添加新条目。新条目将具有“id = 1”，并且以下所有条目都需要将其 ID 更新为“id += 1”，因此不会有重复的 ID。

现在这是我的问题。在创建新条目之后（或之前），我似乎无法更新 ID。这是我的代码：

---

创建新的 Day 对象并将其添加到数组中

//currentID = ID of the entry I'm creating the new one from
//new Day(id, name, date, desc);
//daysArray is the array containing entry objects

var dayToCreate = new Day(currentID,
    $newDayName.val(),
    $newDayDate.val(),
    $newDayDescription.val());
daysArray.splice(currentID, 0, dayToCreate); //

更新所有后续数组元素的 ID 以匹配它们的新数组位置

var ii = daysArray.length - 1;
for (; ii > currentID; ii--) {
    daysArray[ii].id = ii;
    $( ".day#" + ii - 1 ).attr("id", ii); //Change ID of the DOM element
}

为新条目创建 DOM

drawDay(currentID).insertBefore( $( ".day#" + currentID ) );

---

drawDay函数

function drawDay(dayId) {
    var $drawDiv = $( "<div class='day' id='" + daysArray[dayId].id + "'></div>" );

    //Return DOM for the day
    return $drawDiv;
}

Answer 1

var ii = daysArray.length - 1;
for (; ii > currentID; ii--) {
    daysArray[ii].id = ii;
    $( ".day#" + ii - 1 ).attr("id", ii); //Change ID of the DOM element
}

去

var daysArrayLength = daysArray.length,
    i = 0;
for (;i < daysArrayLength; i++ ) {
    daysArray[i].id = i + 1;
}

array.splice(start, deleteCount[, item1[, item2[, ...]]]) 正在更改数组中的索引，所以您可以将索引用作 ID 吗？

另一种方法是为一年中的每一天使用一个包含 365 个项目的数组。不过这样会比较低效。

或者让ID按条目计算，但在这里使用日期：id='" + daysArray[dayId].id + "'