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

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

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

  • 写在最前面
    • 格式化数组
      • 代码解释
      • 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.lryc.cn/news/454040.html

相关文章:

  • LabVIEW回转支承间隙自动化检测系统
  • 数据结构-4.3.串的存储结构
  • LeetCode讲解篇之34. 在排序数组中查找元素的第一个和最后一个位置
  • Linux自动化构建工具Make/Makefile
  • 自动驾驶系列—智能驾驶中的“换挡革命”:线控换挡技术详解
  • .mallox勒索病毒肆虐:了解它的危害与防范措施
  • 如何使用ssm实现基于Java的民宿预订管理系统的设计与实现
  • 光伏组件模型模板在SketchUp中如何完成成模数化设计?
  • 常用组件详解(十):保存与加载模型、检查点机制的使用
  • 基于SpringBoot+Vue+MySQL的在线学习交流平台
  • 前端开发在AI时代如何保持核心竞争力
  • ffmpeg面向对象——拉流协议匹配机制探索
  • R语言绘制柱状图
  • GNU/Linux - tarball文件介绍介绍
  • AppointmentController
  • 网站建设完成后,切勿让公司官网成为摆设
  • 独孤思维:闲得蛋疼才去做副业
  • vulnhub靶场之hackablell
  • 《浔川社团官方通报 —— 为何明确 10 月 2 日上线的浔川 AI 翻译 v3.0 再次被告知延迟上线》
  • 加密与安全_HOTP一次性密码生成算法
  • ResNet18果蔬图像识别分类
  • 深度强化学习中收敛图的横坐标是steps还是episode?
  • 一个真实可用的登录界面!
  • Vue中watch监听属性的一些应用总结
  • MongoDB-aggregate流式计算:带条件的关联查询使用案例分析
  • Redis数据库与GO(一):安装,string,hash
  • expressjs,实现上传图片,返回图片链接
  • 爬虫——XPath基本用法
  • 常见排序算法汇总
  • Golang | Leetcode Golang题解之第459题重复的子字符串