JS 实现通过某个属性值对【对象数组】进行分组

7,594 阅读1分钟

在项目开发中,调用接口请求数据,后台返回的列表数据格式没按某一控制条件进行分组时,需要我们自己对数据重新进行处理,从而获得我们想要的数据结构

<script>
    /**
     * 数组分组
     * @example arrGroup(array, function)
     * @param {Array} arr
     * @param {Function} fn
     * @returns {Array} [[],[]]
     */
    const list = [{
            id: 1,
            name: "张三",
            position: "店长"
        },
        {
            id: 2,
            name: "李四",
            position: "股东"
        },
        {
            id: 3,
            name: "王5",
            position: "店员"
        },
        {
            id: 4,
            name: "小六",
            position: "服务员"
        },
        {
            id: 5,
            name: "张海海",
            position: "股东"
        }, {
            id: 6,
            name: "李波",
            position: "服务员"
        }]

    function arrGroup(arr, fn) {
        const obj = {};
        arr.forEach(item => {
            const key = JSON.stringify(fn(item));
            obj[key] = obj[key] || [];
            obj[key].push(item)
        });
        return Object.keys(obj).map(k => {
            return obj[k];
        })
    }

    const newArr = arrGroup(list, (item) => item.position)
    console.log(newArr)
</script>

运行结果: image.png