首页 > 建站教程 > JS、jQ、TS >  js splice删除数组删不干净正文

js splice删除数组删不干净

js的splice非常强大,可以实现删除、添加、替换数字中的元素。但是它有个致命的问题,如果多次使用,会导致数组的索引混乱,达不到预期效果。如下:

1、要求删除下面数组中,type为1的元素:

var serviceList = [
  {
    label: '客服组',
    type: 0,
    children: [
      {
        label: '客服组1',
        type: 0,
        children: [
          {
            label: '客服组2',
            type: 0
          },
          {
            label: '张三',
            type: 1
          }
        ]
      },
      {
        label: '里斯',
        type: 1
      },
      {
        label: '王武',
        type: 1
      },
      {
        label: '客服组2',
        type: 0
      }
    ]
  }
]
function delType1(list){
  list.forEach((item, index) => {
    if(item.type === 1){
      list.splice(index, 1)
    }else{
      if(item.children){
        delType1(item.children)
      }
    }
  })
}
delType1(serviceList)
console.log(serviceList)


结果如下:

11.png


可以看到,数组中type为1的,并没有删除干净。起因就是删除上一个type为1的元素后,数组的索引少了一个,导致下次循环,略过了当前的符合条件的这一项。解决办法也简单,倒叙递归就可以了。修改上面的函数:

function delType1(list){
  for(var i=list.length-1; i>=0; i--){
    if(list[i].children){
      delType1(list[i].children)
    }else if(list[i].type === 1){
      list.splice(i, 1)
    }
  }
}


再次执行,结果如下:

22.png