[数组拼接在函数内部无法正常工作

Question

预期输出：['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;
//     }   
// }

Answer 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来达到目的。

Answer 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);

Answer 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)) 
}

Answer 4

forEach停止了，因为拼接已完成。实际的数组发生突变，并将最后一个索引降低为1直到已经完成迭代为止。