06、如何将对象数组里 obj 的 key 值变成动态的(即:每一个对象对应的 key 值都不同)

news2025/1/21 7:13:10

1、数据情况:

其一、从后端拿到的数据为: let arr = [1,3,6,10,11,23,24]
其二、目标数据为:

' [{vlan_1: 1, value: 1}, {vlan_3: 3, value: 1}, {vlan_6: 6, value: 1}, {vlan_10: 10, value: 1}, {vlan_11: 11, value: 1}, {vlan_23: 23, value: 1}, {vlan_24: 24, value: 1}'

2、操作过程:

其一、定义一个动态的 key 值来满足业务需求:vlan_X:

A、代码展示:
let arr = [1,3,6,10,11,23,24]
    let res = arr.map(item => {
      let key = `vlan_${item}` // 此时的 key 值就是动态的值(即:会根据 item 值的不同而不同);
      return key
    })

    console.log(res,111111111);
B、结果展示:

在这里插入图片描述

其二、通过 map 操作,获取目标对象数组:

A、代码展示:
let arr = [1,3,6,10,11,23,24]   // 此时的 arr 就是后台提供的数据;
    let res = arr.map(item => { // res 就是想要的目标数据;
      let key = `vlan_${item}`  // 此时的 key 就是 obj 的动态 key 值;
      let obj = {}
      obj[key] = item
      obj.value = 1
      return obj
    })

    console.log(res,22222222);
B、结果展示:

在这里插入图片描述
在这里插入图片描述

3、小结:

其一、哪里有不对或不合适的地方,还请大佬们多多指点和交流!
其二、若有转发或引用本文章内容,请注明本博客地址(直接点击下面 url 跳转) https://blog.csdn.net/weixin_43405300,创作不易,且行且珍惜!
其三、有兴趣的话,可以多多关注这个专栏(Vue(Vue2+Vue3)面试必备专栏)(直接点击下面 url 跳转):https://blog.csdn.net/weixin_43405300/category_11525646.html?spm=1001.2014.3001.5482

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

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

相关文章

java--深刻认识面向对象

1.面向对象编程有啥好处 万物皆对象 汽车的数据,找汽车对象处理 手机的数据,找手机对象处理 学生的数据,找学生对象处理 符合人类思维习惯,编程更简单、更直观 2.程序中的对象到底是啥 对象本质上是一种特殊的数据结构(具体…

基于深度学习的目标检测算法 计算机竞赛

文章目录 1 简介2 目标检测概念3 目标分类、定位、检测示例4 传统目标检测5 两类目标检测算法5.1 相关研究5.1.1 选择性搜索5.1.2 OverFeat 5.2 基于区域提名的方法5.2.1 R-CNN5.2.2 SPP-net5.2.3 Fast R-CNN 5.3 端到端的方法YOLOSSD 6 人体检测结果7 最后 1 简介 &#x1f5…

安卓应用开发环境

安卓应用开发环境 安卓应用开发环境安卓Studio下载安装安卓Gradle下载安装 安装&构建问题Android Studio无法下载SDKSSH变体simple不支持设置端口cvc-complex-type.2.4.aFailed to find Build Tools revison 30.0.2Android Studio无法找到CMakeCMake was unable to …

lang_process() (一)

一、lang_process() 从现在开始介绍 lang_process()函数,是GNU ld(GNU链接器)的一个核心函数,负责执行链接过程中的各个关键操作。lang_process(void) 函数涵盖了整个链接过程中的各个关键步骤,包括符号解析、重定位、…

Spring Boot Actuator 漏洞利用

文章目录 前言敏感信息泄露env 泄露配置信息trace 泄露用户请求信息mappings 泄露路由信息heapdump泄露堆栈信息 前言 spring对应两个版本,分别是Spring Boot 2.x和Spring Boot 1.x,因此后面漏洞利用的payload也会有所不同 敏感信息泄露 env 泄露配置信…

【使用Python编写游戏辅助工具】第二篇:键盘监听的应用

前言 这里是【使用Python编写游戏辅助工具】的第二篇:键盘监听的应用。本文主要介绍使用Python实现事件监听功能。 键盘监听是指通过编程的方式监控用户在键盘上的按键操作。 在这里键盘监听的主要用途是: 监听我们按下的按键,如果按下了指…

@Tag和@Operation标签失效问题。SpringDoc 2.2.0(OpenApi 3)和Spring Boot 3.1.1集成

问题 Tag和Operation标签失效 但是Schema标签有效 pom依赖 <!-- 接口文档--><!--引入openapi支持--><dependency><groupId>org.springdoc</groupId><artifactId>springdoc-openapi-starter-webmvc-ui</artifactId><vers…

最长回文子串-LeetCode5 动态规划

由于基础还不是很牢固 一时间只能想到暴力的解法: 取遍每个子串 总数量nn-1n-2…1 O(n^2) 判断每个子串是否属于回文串 O(n) 故总时间复杂度为O(n^3) class Solution { public:string longestPalindrome(string s) { int max0;string ret;for(int i0;i<s.size();i)for(int…

基于SSM+Vue的宠物用品电子商务平台设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;Vue 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#xff1a;是 目录…

金山文档轻维表之删除所有行记录

目前脚本文档里面的只有删除行记录功能&#xff0c;但是需要指定ID值&#xff0c;不能实现批量删除&#xff0c;很多人反馈但是官方无回应&#xff0c;挺奇怪的 但是批量删除的需求我很需要&#xff0c;最后研究了一下&#xff0c;还是挺容易实现的 测试&#xff1a; 附上脚本…

年终总结一定用得上!这8款AI制作PPT软件不容错过。

PPT&#xff08;PowerPoint&#xff09;已成为日常商务办公、教育和营销环境中广泛使用的一种呈现工具。年终总结时&#xff0c;使用PPT能清晰、直观地展示一年的工作成果&#xff0c;从而让团队成员或上级领导更好地了解并评估工作表现。 在过去&#xff0c;创建精美和引人入…

[PHP]帮管客CRM客户管理系统 v5.1.0

帮管客CRM客户管理系统基于先进的CRM营销理念设计&#xff0c;集客户档案、销售记录、业务往来于一身&#xff0c;以凝聚客户关系、提升资源价值为核心&#xff0c;将潜在客户变为现实客户、从而提升销售量、提高用户的满意度&#xff0c;并增加企业竞争力。帮管客CRM是适用于中…

Redis4 渐进式遍历/自定义客户端/持久化

1.渐进式遍历 1.keys *一次性把所有的key都获取到.但是存在一个问题,一旦数据过多,redis就会被阻塞住,就无暇顾及其他的命令,这样的影响很大. 2.那么就出现了渐进式遍历,可以做到既能获取所有的key,又不会阻塞服务器.渐进式不是一个命令把所有的key获取到,而是没执行一次命令只…

MySQL的3种索引合并优化⭐️or到底能不能用索引?

MySQL的3种索引合并优化⭐️or到底能不能用索引? 前言 前文我们讨论过MySQL优化回表的多种方式&#xff1a;索引条件下推ICP、多范围读取MRR、覆盖索引等 这篇文章我们来聊聊MySQL提供的另一种优化回表的手段&#xff1a;index merge 索引合并 在阅读本文前&#xff0c;你…

windows + Mingw32-make 编译 PoDoFo库,openssl, libjpeg, Msys2工具的使用

参考&#xff1a; https://blog.csdn.net/sspdfn/article/details/104244306 https://blog.csdn.net/yaoyuanyylyy/article/details/17436303 https://blog.csdn.net/wxlfreewind/article/details/106492253 前期进行了各种摸索&#xff0c;由于Podofo依赖库比较多&#xff0c…

Android系统Launcher启动流程学习(一)init启动部分

init进程学习&#xff1a; 文件路径system/core/init/init.cpp 解析init.rc配置文件&#xff0c;首先开启ServiceManager和MediaServer等关键进程init进程fork启动Zygote服务进程处理子进程的终止(signal方式)提供属性服务的功能 int main(int argc, char** argv) {//注释一…

Problem I. Magic Potion--2018ICPC南京

解析&#xff1a; 对于英雄跑一边二分图匹配&#xff0c;记录res1 再跑一边二分图匹配&#xff0c;记录res2 答案即为res1min&#xff08;k&#xff0c;res2&#xff09; #include<bits/stdc.h> using namespace std; int n,m,k; int g[510][510],match[510],st[510]; b…

【Python全栈_公开课学习记录】

一、初识python (一).Python起源 Python创始人为吉多范罗苏姆&#xff08;荷兰&#xff09;&#xff0c;Python崇尚优美、清晰、简明的编辑风格。Python语言结构清晰简单、数据库丰富、运行成熟稳定&#xff0c;科学计算统计分析领先。目前广泛应用于云计算、Web开发、科学运算…

BlockingQueue解析

BlockingQueue其实就是阻塞队列&#xff0c;是基于阻塞机制实现的线程安全的队列。 BlockingQueue不同于普通的Queue的区别主要是&#xff1a; 通过在入队和出队时进行加锁&#xff0c;保证了队列线程安全支持阻塞的入队和出队方法&#xff1a;当队列满时&#xff0c;会阻塞入…

数据结构与算法【01】—绪论

专栏地址:数据结构与算法专栏 开源仓库:bigsai-algorithm仓库 ,欢迎支持 针对以前写的数据结构与算法系列重写(针对文字描述、图片、错误修复),改动会比较大,一直到更新完为止 前言 数据结构与算法是程序员内功体现的重要标准之一,且数据结构也应用在各个方面,业界更有…