javascript - 数组不重新编号

Question

我遇到了一种情况，我必须从数组和 .splice 中删除 obj。发生的情况是数组未正确重新编号，如下所示。

为了在删除数组的对象后摆脱数组中未定义的占位符，我执行了 [].concat()。这样做的问题是新数组的编号不正确。

以较低的开销正确地对新数组重新编号最有效的方法是什么？

for (var o = 0; o < uncheckedQue[i].childNodes.length; o += 1) {
    uncheckedQue[i].removeChild(uncheckedQue[i].childNodes[o]);
    if (uncheckedQue[i].childNodes.length < 1) {
        delete uncheckedQue[i];//remove the document fragment if has no childnodes
    };
};

 uncheckedQue = [].concat(uncheckedQue);


0: DocumentFragment
2: DocumentFragment
3: DocumentFragment
4: DocumentFragment
5: DocumentFragment
6: DocumentFragment
7: DocumentFragment
length: 8

***让我澄清一些事情。这些子节点包含在数组中的文档片段中。这些childNode不在Dom中。

这是外循环。您会注意到为什么我使用删除，因此我保持外循环的长度正确。

     for (var i = 0; i < uncheckedQue.length; i += 1) {
                 //
                 if (t.mucs === t.mucsstop) { break; };
                 for (var o = 0; o < uncheckedQue[i].childNodes.length; o += 1) {
                     uncheckedQue[i].removeChild(uncheckedQue[i].childNodes[o]);
                     t.mucs += 1;
                     if (uncheckedQue[i].childNodes.length < 1) {
                         delete uncheckedQue[i];//remove the document fragment if has no childnodes
                     };
                     if (t.mucs === t.mucsstop) { break; };
                 };
             };

Answer 1

childNodes是一个实时 NodeList，因此每次删除一个项目时，列表都会变短，因此您可以有效地跳过每个第二个节点。如果要从文档片段中删除所有 childNode，最简单的方法是不断删除 firstChild 节点，直到不再有为止:

var node = uncheckedQue[i];
while (node.firstChild) {
  node.removeChild(node.firstChild);
}

此外，NodeList 是一个宿主对象，它不是一个数组，因此对其调用数组方法会抛出错误。

编辑

从您的代码中:

> for (var o = 0; o < uncheckedQue[i].childNodes.length; o += 1) {

采用通用格式会更清楚:

for (var j=0; j < uncheckedQue[i].childNodes.length; j++) {

如果uncheckedQue是文档片段数组，则:

> uncheckedQue[i].removeChild(uncheckedQue[i].childNodes[o]);

正在从片段中删除子节点。因此，现在位于 childNodes[o] 的子节点就是执行该语句之前位于 childNodes[o + 1] 的子节点。因此，在下一次迭代中，o + 1 节点将是之前位于 o + 2 的节点。简单来说，它将删除每两个 child 。

另外:

> if (uncheckedQue[i].childNodes.length < 1) {

可以是:

if (!uncheckedQue[i].childNodes.length) {

自 length value NodeList 的长度是从 0 开始的无符号整数，如果长度为零，则测试返回 true。

要从数组中删除片段，请使用 Array.prototype.splice正如 VeXii 所建议的。但请注意，您必须调整索引或向后遍历数组，原因与删除事件 NodeList 的成员时的原因相同。

You'll notice why i use the delete, so i keep my length correct for the outer loop.

因为删除运算符不会调整数组成员索引(只是属性名称)，所以你有一个稀疏数组。您可以使用拼接并随时调整索引，或者向后遍历数组，或者在最后压缩数组(这可能是性能最差的解决方案)，例如

function compressArray(a) {
  for (var i=0; i<a.length; i++) {
    while (!a.hasOwnProperty(i) && a.length > i) {
      a.splice(i, 1);
    } 
  }
  return a;
}

请注意，上面修改了原始数组。将数组成员复制到新数组更简单:

function compressArray(a) {
  for (var i=0, iLen=a.length, b=[]; i<iLen; i++) {
    if (a.hasOwnProperty(i)) {
      b.push(a[i]);
    } 
  }
  return b;
}

任你挑选。请注意，这两种方法都不会删除值为 undefined 或其他错误值的成员，只会删除那些根本不存在的成员。