json数组删除一个对象，最后返回的数据长度还是原来的长度

Question

一个json数组，通过splice删除指定对象，最后返回的数组长度还是原来的长度，只是原数据被[]替代。
代码如下：
table.on("tool(sampleList)",function(obj) {

            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除' + '<span style="color:red;">' + data.name + '</span>' + '吗', function (index) {
                    obj.del();
                    for(var i=0;i<infoList.length;i++){
                        if(infoList[i].name==data.name){
                            infoList.splice(i,1);
                        }

                    }
                    $('#instrumentPurchaseInfoList').val(JSON.stringify(infoList));
                    layer.close(index);
                });
            }
        })
        
        页面如下：
        

原数据如下：
[{"page":1,"limit":10,"displayStart":0,"flag":0,"userId":null,"userType":0,"id":14,"purchaseId":5,"name":"111","specification":"","unit":"","price":null,"num":null,"generatingUnit":"","LAY_TABLE_INDEX":0},{"page":1,"limit":10,"displayStart":0,"flag":0,"userId":null,"userType":0,"id":15,"purchaseId":5,"name":"sjh","specification":"","unit":"","price":null,"num":null,"generatingUnit":"","LAY_TABLE_INDEX":1},{"page":1,"limit":10,"displayStart":0,"flag":0,"userId":null,"userType":0,"id":16,"purchaseId":5,"name":"222","specification":"","unit":"","price":null,"num":null,"generatingUnit":"","LAY_TABLE_INDEX":2},{"page":1,"limit":10,"displayStart":0,"flag":0,"userId":null,"userType":0,"id":17,"purchaseId":5,"name":"333","specification":"","unit":"","price":null,"num":null,"generatingUnit":"","LAY_TABLE_INDEX":3}]
删除所有后界面如下：

数据如下:
{[],[],[],[]}

Answer 1

你代码有问题,for循环了,然后你又splice删除了,数组长度会变,但是i还是正常递增
如果要用for删除数组,应该从后往前删除

for(var i = arr.length - 1; i > -1; i--) {
    arr.splice(i, 1);
}

Answer 2

用你的代码试了试，并没有出现你说的问题，顺便我自己也写了个

var newArr = infoList.filter(function(item) {
        return item.name != "111";
    });

Answer 3

得理解一下数组的深浅拷贝（对象也适用）

<script>
// 深拷贝 与 浅拷贝 认识 



/*
  浅拷贝： 指的是 复制引用，而不是真正的值。说白了就是 拷贝后的结果改变  被拷贝的数据也会改变。
  深拷贝： 拷贝后的值 会开辟在一个新的内存空间，与被拷贝值的空间相互独立。改变拷贝的值后 不会影响被拷贝的值。
*/

const a = {name: 'wss', age: '16',sex: 'man'}


// 浅拷贝
// let b = a

// console.log(a,'原始数据') // {name: 'wss', age: '16',sex: 'man'}
// console.log(b, '拷贝数据') // {name: 'wss', age: '16',sex: 'man'}
// console.log('准备改变数据') // 准备改变数据
// b.age = '17'
// console.log(a, '改变后的数据') // {name: 'wss', age: '17',sex: 'man'}
// console.log(b, '改变后的数据') // {name: 'wss', age: '17',sex: 'man'}


// 深拷贝（3种方法） 以下三种方法 均可以实现 深拷贝  无论对象或者数组
  // let {...c} = a  // 方法 一
  // let c = Object.assign({}, a) // 方法二

  var clone = function (obj) { // 方法三
      return JSON.parse(JSON.stringify(obj));
  }

  let c = clone(a)

  console.log(a,'原始数据') // {name: 'wss', age: '16',sex: 'man'}
  console.log(c, '拷贝数据') // {name: 'wss', age: '16',sex: 'man'}
  console.log('准备改变数据') // 准备改变数据
  c.age = '17'
  console.log(a, '改变后，原始的数据') // {name: 'wss', age: '16',sex: 'man'}
  console.log(c, '改变后，拷贝的数据') // {name: 'wss', age: '17',sex: 'man'}
</script>