原声js常用的一些数组查询方法如删除数组内指定项Indexof 配合使用

Posted 2020-12-12 少哨兵

arr.splice(arr.indexOf(a),1):找到数组内等a项目并删除：

项目中循环便利找到指定值后删除操作可以用这个比较便捷

另外扩展：

<script>
            var a=1,b=2,c=3
            var arr = [a,b,c]
            var res1 = arr.splice(arr.indexOf(a),1)
            console.log(arr)//[2,3]
            console.log(res1)//[1]
            var arr2 = ["a1","b2","c3"]
            var res2 = arr2.splice(arr2.indexOf("a1"),1)
            console.log(arr2)//["b2","c3"]
            console.log(res2)//["a1"]

            var arr3 = [{a:111},{b:222},"{c:333}"]
            // var res3 = arr3.splice(arr3.indexOf({b:222}),1)//这个有点奇怪会删掉最后一项,原因是因为会找不到指定的这个对象，
            //arr.indexOf({a:111}) 只是你上面的写法 是让数组 去判断一个 新创建的对象，所以会得到 -1
            //可以替换成find- const result = inventory.find( fruit => fruit.name === ‘cherries‘ );
            //arr.find 返回指定符合项目，arr.findIndex 返回指定项目在数组内的索引
                        const inventory = [
                {name: ‘apples‘, quantity: 2},
                {name: ‘bananas‘, quantity: 0},
                {name: ‘cherries‘, quantity: 5}
            ];
            const result = inventory.find( fruit => fruit.name === ‘cherries‘ );
            // const result = inventory.findIndex( fruit => fruit.name === ‘cherries‘ );//2
            console.log(result) // { name: ‘cherries‘, quantity: 5 }

            console.log(arr3.indexOf({b:222}))//-1
            console.log(arr3.indexOf("{c:333}"))//2
            console.log(arr3.indexOf(JSON.stringify({a:111})))//-1
            console.log(arr3.findIndex((v)=>{v.a==111}))//undefined --索引等项必须相同key 如上个数组等name
          
            var res3 = arr3.splice(arr3.indexOf({c:333}),1)
            console.log(arr3)//[{a:111},{b:222}]
            console.log(res3)//[{c:333}]

            var arr4 = [{uid: "WJ133", is_checked: 1, checked_date: "2020-06-05 14:14:39"},
                        {uid: "WJ134", is_checked: 1, checked_date: "2020-06-05 14:15:48"},
                        {uid: "WJ146", is_checked: 1, checked_date: "2020-06-04 13:15:29"}]
                        var res4 =null;
            arr4.forEach(function(v,i){
                if(v.uid == ‘WJ146‘){
                //  res4 =  arr4.splice(arr4.indexOf(v.uid==‘WJ146‘),1)//等同下列
                 res4 =  arr4.splice(arr4.indexOf(v),1)
                }
            })
            console.log(arr4)//[{uid: "WJ133", is_checked: ...},{uid: "WJ134", ....}]
            console.log(res4)//{uid: "WJ146", ...}


        </script>

项目实际情况：

fnAjaxGetChecked(){//3- 接口二 獲取勾選接口
        let url = this.baseurl+‘jk_wire_issue/get_wire_check_info.php?startDate=‘+this.datapicker[0]+‘&endDate=‘+this.datapicker[1]
        this.$http.get(url).then((res)=>{
            console.log(res)
            var  template = res.data
            console.log(template)
            if(!this.data) return
            this.data.forEach((v,i)=>{
                //添加项
                v.test = []//这里添加个专门接收以前等打勾等项目的对象
                if(!v.lj_detail) return
                v.lj_detail.forEach((j,i)=>{
                    if(res.data==null){
                    }
                    if(!res.data) return
                    this.$set(j,8,null)//初始化先清空为没有打勾的项--以便渲染到页面
                    this.$set(j,6,"")//取消打勾后展示清空
                    res.data.forEach((k,i)=>{
                        if(k.uid == j[3]){
                            // console.log(j[3],k.uid)
                            // j.push(‘打钩了‘)
                                this.$set(j,8,"打钩了")
                                // j.push(k.checked_date)//打勾的选择日期 --这里添加展开数据操作业务后时间不能这样设置了 -不然时间一致为空，每次点击都会导入数组内时间
                                this.$set(j,6,k.checked_date)
                                // console.log(‘有打勾的项目是：‘,j)
                                
                                template.splice(template.indexOf(k),1)//这里是要删除掉已经找到匹配到打勾的-剩下等再后面便利就不用再多次重复便利，提高性能
                        }
                    })
                })
            })
            console.log(template)
            console.log(res.data)
            //template  为 打勾项目备份
            this.data.forEach((v,i)=>{
                template.map((k,j)=>{
                    if(v.key == k.uid.substr(0,9)){
                        v.test.push(k)
                    }
                })
                // WJ2006012
            })
            console.log(this.data,"渲染获取勾选接口后")
            
        })
    },