js对数组中相同对象元素进行去重,里面对象相同id,其他不同属性进行文字叠加

需求
js对数组中相同对象元素进行去重,里面对象相同id,其他不同属性进行文字叠加

 let arr1 = [
            {
    
    id:1,name:'ui1'}, 
            {
    
    id:2,name:'ui2'},
            {
    
    id:2,name:'测试'},
            {
    
    id:2,name:'ui2'},
            {
    
    id:3,name:'前端'}, 
            {
    
    id:3,name:'ui3'},
            {
    
    id:3,name:'ui3'},
            {
    
    id:3,name:'ui3'},]  

要求输出

let arr1=[
{
    
    id:1,name:'ui1'},
{
    
    id:2,name:'ui2测试'},
{
    
    id:3,name:'前端测试'}
]

思路:
先对数组去重,再进行相同id name的叠加,结果发现全部相同的id的name都会叠加,所以只取第一个相同id的name
上代码
第一种方法

 <script>
 let arr1 = [
            {
    
    id:1,name:'ui1'}, 
            {
    
    id:2,name:'ui2'},
            {
    
    id:2,name:'测试'},
            {
    
    id:2,name:'ui2'},
            {
    
    id:3,name:'前端'}, 
            {
    
    id:3,name:'ui3'},
            {
    
    id:3,name:'ui3'},
            {
    
    id:3,name:'ui3'},]  
        // 先去重
        function deteleObject(obj) {
    
    
            var uniques = [];
            var stringify = {
    
    };
            for (var i = 0; i < obj.length; i++) {
    
    
                var keys = Object.keys(obj[i]);
                keys.sort(function (a, b) {
    
    
                    return (Number(a) - Number(b));
                });
                var str = '';
                for (var j = 0; j < keys.length; j++) {
    
    
                    str += JSON.stringify(keys[j]);
                    str += JSON.stringify(obj[i][keys[j]]);
                }
                if (!stringify.hasOwnProperty(str)) {
    
    
                    uniques.push(obj[i]);
                    stringify[str] = true;
                }
            }
            uniques = uniques;
            return uniques;
        }
        arr1 = deteleObject(arr1)
        console.log(arr1)
        // 不同name相加
        let arr2 = JSON.parse(JSON.stringify(arr1));
        arr1.forEach(key => {
    
    
            arr2.forEach(item => {
    
    
                if (item.id == key.id && item.name !== key.name) {
    
    
                    key.name = key.name + item.name
                }
            })
        })
        // 发现name重复叠加
        // 只取第一个相同id的叠加name
        let obj = {
    
    }
        arr1 = arr1.reduce((item, next) => {
    
    
            obj[next.id] ? '' : obj[next.id] = true && item.push(next)
            return item
        }, [])
        console.log(arr1)
    </script>

结果
在这里插入图片描述
第二种方法


        // 数据合并    array:需合并的数据
        function arrMerge(array) {
    
    
            // 保存新数组
            let newArr = [];
            array.forEach(item => {
    
    
                // 保存判断结果
                let res = newArr.isExist(item.id, "id");
                // 若不存在新数组中,则直接追加进新数组
                if (res == -1) {
    
    
                    newArr.push(item);
                } else {
    
    
                    // 若存在,则将除id外的字段追加进新数组中
                    for (var key in newArr[res]) {
    
    

                        // if (key == "id") continue;
                        if (newArr[res][key] == item[key]) continue;

                        newArr[res][key] += item[key];
                    };
                };
            });
            return newArr;
        };

        // 判断元素是否存在数组中对象属性中  value:元素   key:对象属性   
        Array.prototype.isExist = function (value, key) {
    
    
            for (let i = 0, len = this.length; i < len; i++) {
    
    
                // 若存在,则返回对应的索引
                if (this[i][key] === value) {
    
    
                    return i;
                }
            }
            // 否则返回 -1
            return -1;
        }

        console.log(arrMerge(arr1));

猜你喜欢

转载自blog.csdn.net/weixin_46476460/article/details/111159212