JavaScript对象数组根据某个属性值筛选分类

🤵 作者coderYYY
🧑 个人简介:前端程序媛,目前主攻web前端,后端辅助,其他技术知识也会偶尔分享🍀欢迎和我一起交流!🚀(评论和私信一般会回!!)
👉 个人专栏推荐:《前端项目教程以及代码》

JavaScript对象数组根据某个属性值筛选分类

在开发中,这种需求还是挺常见的,常用于处理后端返回的数据,话不多说直接上代码:
以下示例是根据性别gender进行分类,要按哪个属性分类就直接把gender替换掉就好

const arr = [{ name: '李大', age: 20, gender: '男' },{ name: '张三', age: 25, gender: '女' },{ name: '王五', age: 20, gender: '女' },{ name: '赵六', age: 30, gender: '男' },{ name: '杨二', age: 25, gender: '男' }
];
let tempArr = [];// 分类属性项
var newArr = [];
arr.forEach((i, index) => {if (tempArr.indexOf(i.gender) === -1) {newArr.push({gender: i.gender,list: [i]});tempArr.push(i.gender);} else {newArr[tempArr.indexOf(i.gender)].list.push(i)}});
console.log(newArr);
  • newArr打印结果:
[{"gender": "男","list": [{"name": "李大","age": 20,"gender": "男"},{"name": "赵六","age": 30,"gender": "男"},{"name": "杨二","age": 25,"gender": "男"}]},{"gender": "女","list": [{"name": "张三","age": 25,"gender": "女"},{"name": "王五","age": 20,"gender": "女"}]}
]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/124209.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

wangEditor富文本编辑器的使用

文章目录 🟢 wangeditor 富文本⭐️安装 wangeditor⭐️demo 模板⭐️效果图 ✒️总结 🟢 wangeditor 富文本 一款开源 Web 富文本编辑器,开箱即用,配置简单 wangedito 官网 简洁易用、功能强大、文档教程丰富支持 JS、Vue、Rea…

VScode 调试go程序报错,需要更改glaunch.json文件

{// 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid830387"version": "0.2.0","go.toolsEnvVars": {"GOOS": "js","…

【Note详细图解】中缀表达式如何转为后缀表达式?数据结构

中缀表达式 中缀表达式(中缀记法)是一个通用的算术或逻辑公式表示方法,操作符是以中缀形式处于操作数的中间(例:3 4),中缀表达式是人们常用的算术表示方法。 前缀或后缀记法不同的是&#xf…

【JVM】类加载器

【JVM】类加载器 文章目录 【JVM】类加载器0. 类加载器概述1. 类加载器的分类1.1 启动类加载器1.2 Java中的默认类加载器1.2.1 扩展类加载器1.2.2 应用程序类加载器 2. 双亲委派机制2.1 类的双亲委派机制是什么?2.2 打破双亲委派机制2.2.1 自定义类加载器2.2.2 线程…

并行和并发有什么区别?

并行和并发 并行和并发最早其实描述的是 Java 并发编程里面的概念。他们强调的是 CPU 处理任务的能力。简单来说: 并发,就是同一个时刻,CPU 能够处理的任务数量,并且对于应用程序来说,不会出现卡顿现象。并行&#x…

【Linux】冯诺依曼体系结构以及初始操作系统

文章目录 冯诺依曼体系结构操作系统概念设计OS的目的定位如何理解管理 总结系统调用和库函数概念 冯诺依曼体系结构 我们常见的计算机,如笔记本。我们不常见的计算机,如服务器,大部分都遵守冯诺依曼体系。 截至目前,我们所认识…

Ubuntu GCC切换源

Ubuntu GCC切换源 sudo apt-get install gcc-9 g-9将安装的 gcc-9和g9更新到gcc选项中 sudo update-alternatives --install /usr/bin/gcc gcc /usr/bin/gcc-9 100 sudo update-alternatives --install /usr/bin/g g /usr/bin/g-9 100将系统的gcc-11和g11更新到gcc选项中&…

HDFS 基本 shell 操作

HDFS 基本 shell 操作 1.1 创建目录1.2 上传指令1.3 创建空文件1.4 向分布式文件系统中的文件里追加内容1.5 查看指令1.6 下载指令1.7 合并下载1.8 移动hdfs中的文件1.9 复制hdfs中的文件到hdfs的另一个目录1.10 删除命令1.11 查看磁盘利用率和文件大小1.12 修改权限1.13 修改文…

366周赛

2897. 对数组执行操作使平方和最大 位运算技巧 2896. 执行操作使两个字符串相等 动规技巧太巧妙,可以多看几遍理解。

专门解决数学问题的大模型

01 项目介绍 LLEMMA:一个专门解决数学问题的开源大语言模型,能力超过所有已知的开源模型 LLEMMA由多个大学和Eleuther AI公司共同研发,模型能够理解和生成数学表达式、解决数学问题,并与其他计算工具(如Python解释器…

ESP32网络开发实例-Web页面控制舵机

Web页面控制舵机 文章目录 Web页面控制舵机1、ESP32驱动舵机介绍2、软件准备3、硬件准备4、代码实现4.1 舵机基本控制实例4.2 使用电位计控制舵机实例4.3 Web页面控制舵机本文将介绍如何在ESP32的Web服务器页面中控制伺服电机。 1、ESP32驱动舵机介绍 在本节中,我们将回顾伺服…

修改el-date-picker宽度

<div style"width: 100%"><el-date-pickerstyle"width:100%"v-model"value"type"datetimerange"start-placeholder"开始日期"end-placeholder"结束日期":default-time"[12:00:00]"value-forma…

pytorch 入门 (五)案例三:乳腺癌识别-VGG16实现

本文为&#x1f517;小白入门Pytorch内部限免文章 &#x1f368; 本文为&#x1f517;小白入门Pytorch中的学习记录博客&#x1f366; 参考文章&#xff1a;【小白入门Pytorch】乳腺癌识别&#x1f356; 原作者&#xff1a;K同学啊 在本案例中&#xff0c;我将带大家探索一下深…

面向对象设计——原型模式

原型设计模式是一种创建型设计模式,其主要目标是创建对象的新实例,同时尽量减少与使用者的交互,以降低对象创建的复杂性。这通过复制(或克隆)现有对象的实例来实现,以获得新对象,而不是通过实例化类来创建。 以下是原型设计模式的关键概念: 原型接口(Prototype Inter…

Response Header中不暴露Server(IIS)版本、ASP.NET及相关版本等信息

ASP MVC开发的Web默认情况下会在请求的回应中暴露Server、X-AspNet-Version、X-AspNetMvc-Version、X-Powered-By等相关服务端信息&#xff0c;公开这些敏感信息会存在一定的安全风险。 X-SourceFiles标头用于被IIS / IIS Express中某些调试模块理解&#xff0c;它包含到磁盘上…

LangChain+LLM实战---BERT主要的创新之处和注意力机制中的QKV

BERT主要的创新之处 BERT&#xff08;Bidirectional Encoder Representations from Transformers&#xff09;是一种基于Transformer架构的预训练语言模型&#xff0c;由Google在2018年提出。它的创新之处主要包括以下几个方面&#xff1a; 双向性&#xff08;Bidirectional&…

【Vue】初步认识<script setup>语法糖和组合式 API

▒ 目录 ▒ &#x1f6eb; 导读需求开发环境 1️⃣ &#x1f6eb; 导读 需求 最近写代码的时候&#xff0c;发现<script setup>这样的代码&#xff0c;没见过&#xff0c;好奇&#xff0c;想知道。 所以就有了这篇文章。 很多文章都说setup是vue3的特权。但是&#xff…

Vue图片路径问题(动态引入)

vue项目中我们经常会遇到动态路径的图片无法显示的问题&#xff0c;以下是静态路径和动态路径的常见使用方法。 1.静态路径 在日常的开发中&#xff0c;图片的静态路径通过相对路径和绝对路径的方式引入。 相对路径&#xff1a;以.开头的&#xff0c;例如./、../之类的。就是…

SQLSmith: Databend 如何利用随机化测试检测 Bug

作者&#xff1a;白 珅 Databend 研发工程师 https://github.com/b41sh 为什么需要 SQLSmith&#xff1f; 在数据库系统的开发和维护过程中&#xff0c;测试扮演着至关重要的角色。它不仅可以验证功能的正确性&#xff0c;还可以发现潜在的问题&#xff0c;确保数据库在每个变…

MySQL主从架构

1 主从架构解决了什么问题 随着业务的持续增长&#xff0c;单体数据库满足不了业务的需求&#xff0c;可能会出现负载过重&#xff0c;操作数据库速度变慢的情况。为了解决这个问题&#xff0c;数据库一般采用一主一从、一主多从的架构。 为了操作提高效率&#xff0c;减轻压…