数组拼接在函数内部没有按预期工作答案

【问题标题】：array splice not working as expected inside the function数组拼接在函数内部没有按预期工作
【发布时间】：2020-02-12 16:07:21
【问题描述】：

预期输出：['jan']
实际输出：['jan', 'apple']

forEach 函数在拼接操作后停止。注释代码按预期工作，但是当我尝试使用 foreach 类似时，代码没有按预期工作。

var mainArr = ['jan', 'feb', 'apple'];
var exArr = ['feb', 'apple'];
removeGivenArr(mainArr, exArr);

function removeGivenArr(mainArr, exArr) {
  mainArr.forEach((item, index) => {

    if (exArr.includes(item)) {
      console.log(item);
      mainArr.splice(index, 1);
    }
    console.log(mainArr);

  });
}

// function removeGivenArr(mainArr, exArr){

//     const output = [];
//     for(let element of mainArr){
//         if(!exArr.includes(element)){
//             output.push(element);
//         }

//     return output;
//     }   
// }

【问题讨论】：

您在迭代数组时正在修改它。
你最好在mainArr 上使用.filter() 来创建一个新数组。
@Amy 但是下面的代码也是一样的。在迭代同一个数组时修改 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]; for( var i = 0; i [1, 2, 3, 4, 6, 7, 8, 9, 0]
@Nash 因为那仍在更改数组的内容...也许您应该查看splice 的文档？

标签： javascript arrays foreach splice

【解决方案1】：

const mainArr = ['jan', 'feb', 'apple'];
const exArr = ['feb', 'apple'];

const filterArr = (mainArr, exArr) => {
  return mainArr.filter((char) => {
    return exArr.indexOf(char) === -1;
  });
}
console.log(filterArr(mainArr, exArr))

您可以简单地使用过滤器和 indexOf 来实现。

【讨论】：

这个解决方案看起来很完美！但是任何方法都可以用 forEach 而不是 Array.prototype.filter();

【解决方案2】：

为了保持mainArr 的相同对象引用，您可以从数组末尾迭代并删除不需要的部分而不违反索引。

function removeGivenArr(mainArr, exArr) {
    var i = mainArr.length;
    while (i--) if (exArr.includes(mainArr[i])) mainArr.splice(i, 1);
}

var mainArr = ['jan', 'feb', 'apple'],
    exArr = ['feb', 'apple'];

removeGivenArr(mainArr, exArr);
console.log(mainArr);

【讨论】：

【解决方案3】：

阅读Splicing a Javascript array from within the callback passed to forEach的答案以获取更多信息。

改用过滤器。

var mainArr = ['jan', 'feb', 'apple'];
var exArr = ['feb', 'apple'];
mainArr = removeGivenArr(mainArr, exArr);
console.log(mainArr)
function removeGivenArr(mainArr, exArr) {
  return mainArr.filter((item) => !exArr.includes(item)) 
}

【讨论】：

【解决方案4】：

forEach 停止了，因为 splice 可以正常工作。实际的数组发生了变异，并将最后一个索引降低到 1 Upto 已经完成了迭代。

【讨论】：