当前位置: 首页 > news >正文

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

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] = itemobj.value = 1return 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

相关文章:

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

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, v…...

ngx_http_request_s

/* 罗剑锋老师的注释参考: https://github.com/chronolaw/annotated_nginx/blob/master/nginx/src/http/ngx_http_request.h */struct ngx_http_request_s {uint32_t signature; /* "HTTP" */ngx_connection_t …...

Docker 学习路线 2:底层技术

了解驱动Docker的核心技术将让您更深入地了解Docker的工作原理,并有助于您更有效地使用该平台。 Linux容器(LXC) Linux容器(LXC)是Docker的基础。 LXC是一种轻量级的虚拟化解决方案,允许多个隔离的Linux系…...

UEFI实战——显示图片

一、准备工作 1.1 BMP格式图片 参考:BMP格式详解获取“BMP格式详解”文档里的图片,命名为Logo.bmp将Logo.bmp图片放到U盘里,U盘格式FAT32二、实例代码 2.1 代码结构 TextPkg/ ├── Display.c ├── GetFile.c ├── Test.c ├── Test.dsc ├── Test.h └── Tes…...

Ansible中的playbook

目录 一、playbook简介 二、playbook的语法 三、playbook的核心组件 四、playbook的执行命令 五、vim 设定技巧 六、基本示例 一、playbook简介 1、playbook与ad-hoc相比,是一种完全不同的运用。 2、playbook是一种简单的配置管理系统与多机器部署系统的基础…...

怎样去除视频中的杂音,保留人声部分?

怎样去除视频中的杂音,保留人声部分?这个简单嘛!两种办法可以搞定:一是进行音频降噪,把无用的杂音消除掉;二是提取人声,将要保留的人声片段提取出来。 这就将两种实用的办公都分享出来&#xf…...

基于Qt QTreeView|QTreeWidget控件使用简单版

头文件解析: 这是一个C++代码文件,定义了一个名为MainWindow的类。以下是对每一句的详细解释: ```cpp #ifndef MAINWINDOW_H #define MAINWINDOW_H ``` 这是一个条件编译指令,用于避免头文件的重复包含。`MAINWINDOW_H`是一个宏定义,用于唯一标识这个头文件。 ```cpp #…...

edge浏览器的隐藏功能

1. edge://version 查看版本信息 2. edge://flags 特性界面 具体到某一特性:edge://flags/#overlay-scrollbars 3. edge://settings设置界面 详情可参考chrome: 4. edge://extensions 扩展程序页面 5. edge://net-internals 网络事件信息 6. edge://component…...

安卓抓包之小黄鸟

下载安装 下载地址: https://download.csdn.net/download/yijianxiangde100/88496463 安装apk 即可。 证书配置:...

Django中的FBV和CBV

一、两者的区别 1、在我们日常学习Django中,都是用的FBV(function base views)方式,就是在视图中用函数处理各种请求。而CBV(class base view)则是通过类来处理请求。 2、Python是一个面向对象的编程语言…...

信息泄露--

大唐电信AC简介 大唐电信科技股份有限公司是电信科学技术研究院(大唐电信科技产业集团)控股的的高科技企业,大唐电信已形成集成电路设计、软件与应用、终端设计、移动互联网四大产业板块。 大唐电信AC集中管理平台存在弱口令及敏感信息泄漏漏…...

C#WPF文本格式化模式实例

本文演示C#WPF文本格式化模式实例 WPF 文本渲染优缺点 WPF中的文本渲染和旧式的基于 GDI的应用程序的文本染有很大区别。很大一部分区 别是由于 WPF 的设备无关显示系统造成的,但 WPF 中的文本染也得到了显著增强,能更清晰地显示文本,在 LCD 监视器上尤其如此。 然而,W…...

嵌入式云平台一些基础概念的理解

1.SDK SDK是Software Development Kit的缩写,译为”软件开发工具包”,通常是为辅助开发某类软件而编写的特定软件包,框架集合等,SDK一般包含相关文档,范例和工具。 我自己的理解就似乎,SDK也就是软件开发工具包,他会为其使用者提供一些封装好的接口&…...

【项目管理】生命周期风险评估

规划阶段目标:识别系统的业务战略,以支撑系统的安全需求及安全战略 规划阶段评估重点:1、本阶段不需要识别资产和脆弱性;2、应根据被评估对象的应用对象、应用环境、业务状况、操作要求等方面识别威胁; 设计阶段目标…...

力扣 搜索旋转排序数组 二分

&#x1f468;‍&#x1f3eb; 33. 搜索旋转排序数组 class Solution {public int search(int[] nums, int target){int l 0;int r nums.length - 1;while (l < r){int m l r >> 1;//else大法&#xff0c;把无序段抛给else&#xff0c;if只处理有序段 // 需要特…...

【软件测试】个人博客项目测试报告

目录 1.报告概要 2、测试环境 3、手动测试用例编写 4、自动化测试用例 1.报告概要 测试对象&#xff1a;基于SSM项目的博客系统。 测试目的&#xff1a;检测博客项目是否符合预期&#xff0c;并且对测试知识进行练习和巩固。 测试点&#xff1a;主要针对常用的功能进行测…...

Express框架开发接口之今日推荐等模块

1.初始化 const handleDB require(../handleDB/index) // 获取全部模块 exports.allModule (req, res) > {(async function () {})() } // 更新或者添加模块 exports.upModule (req, res) > {(async function () {})() } // 根据id删除模块 exports.delModule (req, …...

UTONMOS:元宇宙顺势而上,重构数字化发展新形态

元宇宙&#xff08;Metaverse&#xff09;是一个虚拟的、且与现实世界平行的虚拟世界&#xff0c;由一系列相互关联的技术组成。在这个虚拟世界中&#xff0c;人们可以通过 VR、 AR等设备进入其中&#xff0c;与虚拟人物进行互动。 随着新一代信息技术的飞速发展&#xff0c;元…...

【Nginx37】Nginx学习:SSL模块(一)简单配置与指令介绍

Nginx学习&#xff1a;SSL模块&#xff08;一&#xff09;简单配置与指令介绍 又是一个重点模块&#xff0c;SSL 模块&#xff0c;其实就是我们常见的 HTTPS 所需要的配置模块。HTTPS 的重要性不用多说了吧&#xff0c;现在所有的 App、小程序 都强制要求是 HTTPS 的&#xff0…...

CompletableFuture 异步调用,获取返回值

ExecutorService executor new ThreadPoolExecutor(8, 16, 60,TimeUnit.MINUTES,new ArrayBlockingQueue<>(100));Random randomnew Random(10);//模拟查询用户列表List<User> listselectUsers();//需要执行的任务列表// 任务列表List<CompletableFuture<Us…...

华为云AI开发平台ModelArts

华为云ModelArts&#xff1a;重塑AI开发流程的“智能引擎”与“创新加速器”&#xff01; 在人工智能浪潮席卷全球的2025年&#xff0c;企业拥抱AI的意愿空前高涨&#xff0c;但技术门槛高、流程复杂、资源投入巨大的现实&#xff0c;却让许多创新构想止步于实验室。数据科学家…...

React Native 开发环境搭建(全平台详解)

React Native 开发环境搭建&#xff08;全平台详解&#xff09; 在开始使用 React Native 开发移动应用之前&#xff0c;正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南&#xff0c;涵盖 macOS 和 Windows 平台的配置步骤&#xff0c;如何在 Android 和 iOS…...

shell脚本--常见案例

1、自动备份文件或目录 2、批量重命名文件 3、查找并删除指定名称的文件&#xff1a; 4、批量删除文件 5、查找并替换文件内容 6、批量创建文件 7、创建文件夹并移动文件 8、在文件夹中查找文件...

ESP32读取DHT11温湿度数据

芯片&#xff1a;ESP32 环境&#xff1a;Arduino 一、安装DHT11传感器库 红框的库&#xff0c;别安装错了 二、代码 注意&#xff0c;DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

工业自动化时代的精准装配革新:迁移科技3D视觉系统如何重塑机器人定位装配

AI3D视觉的工业赋能者 迁移科技成立于2017年&#xff0c;作为行业领先的3D工业相机及视觉系统供应商&#xff0c;累计完成数亿元融资。其核心技术覆盖硬件设计、算法优化及软件集成&#xff0c;通过稳定、易用、高回报的AI3D视觉系统&#xff0c;为汽车、新能源、金属制造等行…...

基于Java Swing的电子通讯录设计与实现:附系统托盘功能代码详解

JAVASQL电子通讯录带系统托盘 一、系统概述 本电子通讯录系统采用Java Swing开发桌面应用&#xff0c;结合SQLite数据库实现联系人管理功能&#xff0c;并集成系统托盘功能提升用户体验。系统支持联系人的增删改查、分组管理、搜索过滤等功能&#xff0c;同时可以最小化到系统…...

C/C++ 中附加包含目录、附加库目录与附加依赖项详解

在 C/C 编程的编译和链接过程中&#xff0c;附加包含目录、附加库目录和附加依赖项是三个至关重要的设置&#xff0c;它们相互配合&#xff0c;确保程序能够正确引用外部资源并顺利构建。虽然在学习过程中&#xff0c;这些概念容易让人混淆&#xff0c;但深入理解它们的作用和联…...

群晖NAS如何在虚拟机创建飞牛NAS

套件中心下载安装Virtual Machine Manager 创建虚拟机 配置虚拟机 飞牛官网下载 https://iso.liveupdate.fnnas.com/x86_64/trim/fnos-0.9.2-863.iso 群晖NAS如何在虚拟机创建飞牛NAS - 个人信息分享...

学习一下用鸿蒙​​DevEco Studio HarmonyOS5实现百度地图

在鸿蒙&#xff08;HarmonyOS5&#xff09;中集成百度地图&#xff0c;可以通过以下步骤和技术方案实现。结合鸿蒙的分布式能力和百度地图的API&#xff0c;可以构建跨设备的定位、导航和地图展示功能。 ​​1. 鸿蒙环境准备​​ ​​开发工具​​&#xff1a;下载安装 ​​De…...

解决MybatisPlus使用Druid1.2.11连接池查询PG数据库报Merge sql error的一种办法

目录 前言 一、问题重现 1、环境说明 2、重现步骤 3、错误信息 二、关于LATERAL 1、Lateral作用场景 2、在四至场景中使用 三、问题解决之道 1、源码追踪 2、关闭sql合并 3、改写处理SQL 四、总结 前言 在博客&#xff1a;【写在创作纪念日】基于SpringBoot和PostG…...