js数组去重与循环对象

目录

一、数组对象去重

1.1、需要获取重复数据

1.2、直接过滤filter+findIndex

二、循环对象

三、多层数组对象过滤

一、数组对象去重

1.1、需要获取重复数据

 let persons = [
        {
            "name": "yzq",
            "age": 20,
            "gender": true,
            "height": 10
        },
        {
            "name": "yzq",
            "age": 20,
            "gender": false,
            "height": 20
        },
        {
            "name": "xeon",
            "age": 20,
            "gender": true,
            "height": 30
        },
        {
            "name": "xeon",
            "age": 20,
            "gender": true,
            "height": 180
        },
        {
            "name": "xeon",
            "age": 20,
            "gender": false,
            "height": 180
        },
        {
            "name": "yz1",
            "age": 30,
            "gender": true,
            "height": 180
        }
    ]

    let data = [];
    persons.forEach(item => {
        if (data.length == 0) {
            data.push(item);
        } else {
            let isDiff = true;//是否不同
            for (let i = 0; i < data.length; i++) {
                let dataItem = data[i];
                if (dataItem.name == item.name && dataItem.age == item.age) {
                    /*集合中已经存在相同数据*/
                    isDiff = false;
                    break;
                }
            }
            if (isDiff) {
                data.push(item);
            }
        }
    });
    // persons = data
    console.log(persons, '去重后的数据：', data)

上图左边为去重前，右边为去重后 

1.2、直接过滤filter+findIndex

 persons = persons.filter(
      (obj, index) =>
        persons.findIndex(
          (item) =>
            item.name == obj.name &&
            item.age == obj.age
        ) === index
    );

var newArr = this.IsNull.filter((item, index) => {
                return this.IsNull.indexOf(item) === index;
});

上面第一种改变自身，第二种不改变自身。

二、循环对象

    let obj = {
        a: { "name": "xeon" },
        b: { "age": 20 },
        c: { "gender": false },
    }
    for (item in obj) {
        console.log("obj", item, obj[item]);
    }
    let key = Object.keys(obj)
    let key2 = Object.values(obj)
    let key3 = Object.entries(obj);
    for (let [key, value] of Object.entries(obj)) {
        console.log(key, value);
    }
    console.log(key, key2, key3);

输出结果:

（1）直接循环对象，用for...in..,可以拿到obj对应的key与values

（2）借助Object.keys()可以将对象的key依次取到，变为一个数组 

（3）借助Object.values()可以将对象的values依次取到，变为一个数组 

（4）借助Object.entries()返回一个给定对象自身可枚举属性的键值对数组

（5）Vue视图中用v-for循环对象：

值：{{ val }}

键：{{ key }}

索引：{{ index }}

三、多层数组对象过滤

左边为原始数据，根据给定的id取出对应的对象和所在层级。