javascript - 如何删除 JS 中参数指定的数组中的元素？

Question

我正在做一项作业，其中为我提供了一个数组和不同数量的参数。我必须从初始数组中删除与这些参数具有相同值的所有值。这是我的代码:

function destroyer(arr) {
  for(var i = 1; i < arguments.length; i++)
  {
      for(var j = 0; j < arr.length; j++)
      {
          if(arguments[i] == arr[j])
          {
              arr.splice(j, 1);
          }
      }
  }
  return arr;
}

destroyer([3, 5, 1, 2, 2], 2, 3, 5)

对于某些数组和参数模式，我得到了正确的输出，但对于上面的示例，它应该只输出 [1]，但我的代码正在输出 [1, 2]。任何帮助，将不胜感激。谢谢。

Answer 1

当您执行 .splice() 删除某个项目时，它会将其后面的元素移动到数组中的某个位置，这将导致您的 for 循环如果下一个元素恰好也匹配，则错过下一个元素。您可以通过在删除项目后递减 for 循环索引来解决这个问题，或者(我最喜欢的)您可以从后到前迭代数组，然后使用 .splice() 不会影响任何 future 的迭代。

使用您的一般代码结构，这是递减解决方案:

function destroyer(arr) {
  for(var i = 1; i < arguments.length; i++)
  {
      for(var j = 0; j < arr.length; j++)
      {
          if(arguments[i] == arr[j])
          {
              arr.splice(j, 1);
              --j;
          }
      }
  }
  return arr;
}

var result = destroyer([3, 5, 1, 2, 2], 2, 3, 5);
document.write(JSON.stringify(result));

使用您的一般代码结构，这是反向迭代解决方案:

function destroyer(arr) {
  for(var i = 1; i < arguments.length; i++)
  {
      for(var j = arr.length - 1; j >= 0; j--)
      {
          if(arguments[i] == arr[j])
          {
              arr.splice(j, 1);
          }
      }
  }
  return arr;
}

var result = destroyer([3, 5, 1, 2, 2], 2, 3, 5);
document.write(JSON.stringify(result));

<小时/>

您还可以使用其他数组辅助函数来利用更多 native 数组功能:

function destroyer(arr) {
    var removes = Array.prototype.slice.call(arguments, 1);
    return arr.filter(function(item) {
        return removes.indexOf(item) === -1;
    });
}

var result = destroyer([3, 5, 1, 2, 2], 2, 3, 5);
document.write(JSON.stringify(result));

使用 ES6 Set 可以提高潜在效率:

    function destroyer(arr) {
        var removes = new Set(Array.prototype.slice.call(arguments, 1));
        return arr.filter(function(item) {
            return !removes.has(item);
        });
    }

    var result = destroyer([3, 5, 1, 2, 2], 2, 3, 5);
    document.write(JSON.stringify(result));

仅供引用，在前面的代码示例中，我尝试这样做:

var removes = new Set(arguments);

因为它看起来更干净，并且在 IE 和 Chrome 中运行得很好，但是 Firefox 中的一个错误使其无法在其中运行。 ES6 中的 arguments 应该是一个可迭代的，您可以将其传递给 Set 构造函数，但 Firefox 尚未正确实现这一点。有一个open Firefox bug关于正在研究的主题。因此，我支持此代码示例，将其复制到真实数组中，并将该数组传递给构造函数。

<小时/>

另一种可能性是使用 ES6 剩余参数:

function destroyer(arr, ...items) {
  var removes = new Set(items);
  return arr.filter(function(item) {
    return !removes.has(item);
  });
}

var result = destroyer([3, 5, 1, 2, 2], 2, 3, 5);
document.write(JSON.stringify(result));