javascript - 在Javascript中切换值进出数组

Question

我想要一个简单的值数组，即

var simpleArray = ["SE1","SE2","SE3"];

我想在发生动作时检查这个数组（点击谷歌地图图层），它将一个值传递给这个函数，然后将该值添加到数组中，或者如果它已经存在则从数组中删除它。

我现在看到 .splice/push/inArray/indexOf （在 IE 中不起作用）/grep （jQuery）有点困惑 - 不确定最佳实践是什么。

Answer 1

假设项目的顺序无关紧要，您可以执行以下操作：

function toggleArrayItem(a, v) {
    var i = a.indexOf(v);
    if (i === -1)
        a.push(v);
    else
        a.splice(i,1);
}

从版本 9 开始，该.indexOf()方法在 IE 中有效，但如果您需要支持较旧的 IE 版本，您可以使用MDN中解释的 shim 。或者，如果您仍然使用 jQuery，请$.inArray()改用。

Answer 2

我的 ES* 变体

const toggleArrayValue = (arrayList, arrayValue) =>
  arrayList.includes(arrayValue)
    ? arrayList.filter(el => el !== arrayValue)
    : [...arrayList, arrayValue]

Answer 3

非常紧凑的 lodash 版本，使用xor 函数，用于创建仅在一个数组中而不是另一个数组中找到的新值数组

xor(array, [valueYouWantToToggle])

Answer 4

此外，如果该值是一个对象：

const eq = (a, b) => a == b

const toggle = (arr, item) => {
  const resultArray = [];
  let duplicate = false;
  for(let i = 0; i < arr.length; i++) {
    if(!eq(arr[i], item)) {
      resultArray.push(arr[i]);
    } else {
      duplicate = true
    }
  }
  if(!duplicate) {
    resultArray.push(item)
  }
  return resultArray;
}