对JS数组进行归类

该文章介绍了一个名为mapArray的函数,它用于处理具有相同key的数组元素。函数通过遍历目标数组,将具有相同key的项合并到一起,最终形成一个新的二维数组。在内部,它使用一个对象作为临时存储,根据key来组织数据,然后将结果转换回数组并返回。
摘要由CSDN通过智能技术生成
//处理数组的方法
function mapArray(target) {
        let obj = {};
        result = [];
        target.map((item) => {
          let key = item.key;
          //如果有这个key,就push一个对象
          if (obj[key]) {
            obj[key].push(item);
          //如果没有这个key,就把对象设置成数组格式(方便后面push进去)
          } else {
            obj[key] = [item];
          }
        });
        //根据obj中有几个对象,挨个push进去,组成最后的数组
        for (const key in obj) {
          const element = obj[key];
          result.push(element);
        }
        return result;
      }
 console.log(mapArray(arr )); //调用方法,打印的结果如下:
[
	[{
       key: "a",
       value: 1,
      },{
       key: "a",
       value: 2,
      }],
   [{
      key: "b",
      value: 3,
      },{
      key: "b",
      value: 4,
   }],[{
      key: "c",
      value: 5,
     }],
]

可以使用 Array.prototype.reduce() 方法来实现这个功能。具体步骤如下: 1. 遍历数组,对于每个元素,获取需要归类的属性值。 2. 在 reduce() 方法中创建一个对象,用于保存归类后的结果。 3. 对于每个元素,检查对象中是否已经存在该属性值对应的数组,如果不存在,则创建一个新数组,并将该元素添加到数组中;如果已经存在,则将该元素添加到对应的数组中。 4. 最后,将对象中的值转换为数组,即可得到归类后的结果。 下面是一个示例代码: ```javascript const arr = [ { name: 'apple', type: 'fruit' }, { name: 'banana', type: 'fruit' }, { name: 'carrot', type: 'vegetable' }, { name: 'orange', type: 'fruit' }, { name: 'broccoli', type: 'vegetable' }, { name: 'pear', type: 'fruit' }, { name: 'tomato', type: 'vegetable' }, { name: 'pepper', type: 'vegetable' }, { name: 'grape', type: 'fruit' }, { name: 'potato', type: 'vegetable' }, ]; const result = arr.reduce((obj, item) => { if (obj[item.type]) { obj[item.type].push(item); } else { obj[item.type] = [item]; } return obj; }, {}); console.log(result); ``` 输出结果为: ```javascript { fruit: [ { name: 'apple', type: 'fruit' }, { name: 'banana', type: 'fruit' }, { name: 'orange', type: 'fruit' }, { name: 'pear', type: 'fruit' }, { name: 'grape', type: 'fruit' } ], vegetable: [ { name: 'carrot', type: 'vegetable' }, { name: 'broccoli', type: 'vegetable' }, { name: 'tomato', type: 'vegetable' }, { name: 'pepper', type: 'vegetable' }, { name: 'potato', type: 'vegetable' } ] } ``` 在这个示例中,我们将 `arr` 数组中的元素按照 `type` 属性进行归类,得到一个包含 `fruit` 和 `vegetable` 两个属性的对象。每个属性对应一个数组,包含相同 `type` 属性值的元素。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

天高任鸟飞dyz

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值