【前端】前端数据转化为后端数据

【前端】前端数据转化为后端数据

  • 写在最前面
    • 格式化数组
      • 代码解释
      • hasOwnProperty是什么?


请添加图片描述

🌈你好呀!我是 是Yu欸
🌌 2024每日百字篆刻时光,感谢你的陪伴与支持 ~
🚀 欢迎一起踏上探险之旅,挖掘无限可能,共同成长!

写在最前面

如题,我希望【前端】前端数据转化为后端数据。

格式化数组

  // 初始化 dataList 数组let dataList = [];// 遍历 processedData 对象的每个属性for (let key in processedData) {if (processedData.hasOwnProperty(key) && fieldToDataType[key]) {// 根据映射表获取 dataTypelet dataType = fieldToDataType[key];// 将转换后的数据添加到 dataListdataList.push({dataType: dataType,value: processedData[key],});}}

代码解释

这段代码,其主要功能是将一个名为 processedData 的对象中的数据转换为一个新的数组 dataList。转换的依据是一个映射表 [fieldToDataType],该映射表定义了 processedData 对象的属性名(key)与一个称为 dataType 的数字之间的对应关系。下面是这段代码的逐步解释:

  1. 使用 for...in 循环遍历 processedData 对象中的每个属性(key)。

  2. 对于每个属性,首先使用 hasOwnProperty 方法检查 processedData 是否自身拥有该属性,而不是从其原型链上继承的。这是为了确保只处理对象自身的属性。

  3. 接着,检查映射表 [fieldToDataType]中是否存在当前属性名(key)的映射。这一步确保只处理那些在映射表中定义了对应关系的属性。

  4. 如果上述两个条件都满足,那么从映射表 [fieldToDataType]中获取当前属性名对应的 dataType 值。

  5. 创建一个新的对象,包含两个属性:dataType 和 [value]是 processedData 对象中当前属性的值。

  6. 将这个新创建的对象添加到 dataList 数组中。

通过这个过程,原始的 processedData 对象被转换成了一个新的数组 dataList,其中每个元素都是一个包含 dataType 和 [value]的对象。这种转换使得数据更加结构化,便于后续处理或展示。

hasOwnProperty是什么?

hasOwnProperty 是 JavaScript 中的一个方法,用于检查对象自身(而非其原型链上)是否具有指定的属性。它是 Object.prototype 的一个方法,可以被所有的对象继承使用。这个方法接受一个字符串参数,即要检查的属性名,返回一个布尔值,表示对象是否具有该属性。

在使用 for...in 循环遍历对象的属性时,这个方法通常被用来确保属性是该对象自身的属性,而不是从原型链上继承下来的。这是因为 for...in 循环会遍历对象自身的所有可枚举属性以及它原型链上的可枚举属性。

示例代码:

const obj = {ownProperty: 'value'
};console.log(obj.hasOwnProperty('ownProperty')); // 输出:true
console.log(obj.hasOwnProperty('toString')); // 输出:false,因为toString是从原型链上继承的

在这个例子中,obj 对象有一个自身的属性 ownProperty,所以 obj.hasOwnProperty('ownProperty') 返回 true。而 toString 方法是所有对象从 Object.prototype 继承的,所以 obj.hasOwnProperty('toString') 返回 false


hello,我是 是Yu欸 。如果你喜欢我的文章,欢迎三连给我鼓励和支持:👍点赞 📁 关注 💬评论,我会给大家带来更多有用有趣的文章。
原文链接 👉 ,⚡️更新更及时。

欢迎大家添加好友交流。

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

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

相关文章

【操作系统】引导(Boot)电脑的奇妙开机过程

🌹😊🌹博客主页:【Hello_shuoCSDN博客】 ✨操作系统详见 【操作系统专项】 ✨C语言知识详见:【C语言专项】 目录 什么是操作系统的引导? 操作系统的引导(开机过程) Windows操作系…

渗透测试入门学习——使用python脚本自动识别图片验证码,OCR技术初体验

写在前面 由于验证码在服务端生成后存储在服务器的session中,而标用于标识用户身份的sessionid存在于用户cookie中 所以本次识别验证码时需要用requests.session()创建会话对象,模拟真实的浏览器行为,保持与服务器的会话才能获取登录时服务…

常用排序算法(下)

目录 2.5 冒泡排序 2.6 快速排序 2.6 1 快速排序思路 详细步骤 2.6 2 快速排序递归实现 2.6 3快速排序非递归: 快排非递归的优势 非递归思路 1. 初始化栈 2. 将整个数组的起始和结束索引入栈 3. 循环处理栈中的子数组边界 4. 单趟排序 5. 处理分区后的子…

【论文速看】DL最新进展20241005-Transformer、目标跟踪、Diffusion Transformer

目录 【Transformer】【目标跟踪】【Diffusion Transformer】 【Transformer】 [NeurlPS 2024] Parameter-Inverted Image Pyramid Networks 机构:清华大学、上海AI Lab、上交、港中文、商汤 论文链接:https://arxiv.org/pdf/2406.04330 代码链接&…

C++ | Leetcode C++题解之第454题四数相加II

题目&#xff1a; 题解&#xff1a; class Solution { public:int fourSumCount(vector<int>& A, vector<int>& B, vector<int>& C, vector<int>& D) {unordered_map<int, int> countAB;for (int u: A) {for (int v: B) {count…

网络基础 【HTTPS】

&#x1f493;博主CSDN主页:麻辣韭菜&#x1f493;   ⏩专栏分类&#xff1a;Linux初窥门径⏪   &#x1f69a;代码仓库:Linux代码练习&#x1f69a; &#x1f4bb;操作环境&#xff1a; CentOS 7.6 华为云远程服务器 &#x1f339;关注我&#x1faf5;带你学习更多Linux知识…

LabVIEW提高开发效率技巧----调度器设计模式

在LabVIEW开发中&#xff0c;针对多任务并行的需求&#xff0c;使用调度器设计模式&#xff08;Scheduler Pattern&#xff09;可以有效地管理多个任务&#xff0c;确保它们根据优先级或时间间隔合理执行。这种模式在需要多任务并发执行时特别有用&#xff0c;尤其是在实时系统…

软件验证与确认实验一:静态分析

目录 1. 实验目的及要求.................................................................................................... 3 2. 实验软硬件环境.................................................................................................... 3 …

JAVA运用中springBoot获取前端ajax提交参数方式汇总

本篇文章主要讲解springboot获取前端提交的参数信息&#xff0c;后端进行接受的常见方法汇总&#xff0c;通过本篇文章你可以快速掌握对表单和连接参数获取的能力。 作者&#xff1a;任聪聪 日期&#xff1a;2024年10月5日 一、delete、get等url参数获取方式 前台提交&#xf…

数字图像处理:空间域滤波

1.数字图像处理&#xff1a;空间域滤波 1.1 滤波器核&#xff08;相关核&#xff09;与卷积 图像上的邻域计算 线性空间滤波的原理 滤波器核&#xff08;相关核&#xff09;是如何得到的&#xff1f; 空间域的卷积 卷积&#xff1a;滤波器核与window中的对应值相乘后所有…

【Echarts】折线图和柱状图如何从后端动态获取数据?

&#x1f680;个人主页&#xff1a;一颗小谷粒 &#x1f680;所属专栏&#xff1a;Web前端开发 很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~ 目录 1.1 前端数据分析 1.2 数据库表分析 1.3 后端数据处理 1.4 前端接收数据 继上一篇文章&…

MySQL 查询优化器

文章目录 控制查询计划optimizer_prune_leveloptimizer_search_depth 优化器参数优化器提示索引提示成本模型server_costcost_name engine_cost 控制查询计划 https://dev.mysql.com/doc/refman/8.4/en/controlling-query-plan-evaluation.html 在执行SQL前会根据优化器选择执…

C++_智能指针详解

什么是智能指针&#xff1f;为什么要有智能指针&#xff1f;到目前为止&#xff0c;我们编写的程序所使用的对象都有着严格定义的生命周期。比如说&#xff0c;全局对象在程序启动时分配&#xff0c;在程序结束时销毁&#xff1b;再比如说局部static对象在第一次使用前分配&…

electron-builder 首次执行报错问题解决

假日想研究一下 react electron 的使用&#xff0c;结果发现首次打包疯狂报错&#xff0c;研究了一下之后才发现是第一次的话 electron-builder 会从外面下载依赖包到我们系统中&#xff0c;由于某种力量导致压缩包无法下载或者是下载过慢导致失败&#xff0c;要解决其实也简单…

初学51单片机之I2C总线与E2PROM二

总结下上篇博文的结论&#xff1a; 1&#xff1a;ACK信号在SCL为高电平期间会一直保持。 2&#xff1a;在字节数据传输过程中如果发送电平跳变&#xff0c;那么电平信号就会变成重复起始或者结束的信号。&#xff08;上篇博文的测试方法还是不能够明确证明这个结论&#xff0…

【C++】入门基础介绍(上)C++的发展历史与命名空间

文章目录 1. 前言2. C发展历史2. 1 C版本更新特性一览2. 2 关于C23的一个小故事: 3. C的重要性3. 1 编程语言排行榜3. 2 C在工作领域中的应用 4. C学习建议和书籍推荐4. 1 C学习难度4. 2 学习书籍推荐 5. C的第一个程序6. 命名空间6. 1 namespace的价值6. 2 namespace的定义6. …

首届中美可持续发展峰会在加州圆满举行,引领国际绿色发展新方向

现场嘉宾与(部分)与会人员大合影 2024年8月18日,由美国领创商业联盟(Youth Entrepreneur Business Alliance, YEBA)主办的首届中美可持续发展峰会(Sino-American Symposium on Sustainable Development)在加州森林湖市(Lake Forest)盛大举行。此次峰会吸引了数百名来自中美两国…

HTML+CSS之表格(15个案例+代码+效果图+素材)

目录 1.table标签的border属性 案例:制作一个带边框的表格 1.代码 2.效果 2.table标签的cellspacing属性 案例:制作一个带边距的表格 1.代码 2.效果 3.table标签的cellpadding属性 1.代码 2.效果 4.table标签的width和height属性 案例:指定宽高的表格 1.代码 2.效果 5.table标签…

全新芒果YOLOv10改进135:最新注意力机制EMA:即插即用,具有跨空间学习的高效多尺度注意力模块,ICCASSP 2023

💡本篇内容:芒果YOLOv10改进135:最新注意力机制EMA:即插即用,具有跨空间学习的高效多尺度注意力模块,ICCASSP 2023 **具有跨空间学习的高效多尺度注意力模块EMA | 即插即用 该模块通常包括多个并行的注意力子模块,每个子模块关注于输入数据的不同尺度或分辨率。这些子模块…

HTML+CSS表单控件(11个案例+代码+效果图)

目录 单行文本框 (text) 案例:制作一个单行文本框 1.代码 2.效果 密码输入框 (password) 案例:制作密码输入框 1.代码 2.效果 单选按钮 (radio) 案例:制作单选按钮 1.代码 2.效果 复选框 (checkbox) 案例:制作一个复选框 1.代码 2.效果 普通按钮 (button) 案例:制作一个普通按钮…