编码约定:将后端与前端标签匹配

精英种族大象

在我的后端,我用camelcase标记了数据属性:

customerStats: {
  ownedProducts: 100,
  usedProducts: 50,
},

我的UI代码的设置方式使[“ label”,data]数组在大多数情况下效果最佳,即最便于前端编码。在我的前端,我需要这些标签使用正确的英文拼写,以便可以在UI中按原样使用它们:

customerStats: [
  ["Owned products", 100],
  ["Used products", 50],
],

我的问题是有关Web开发的最佳做法或标准。我在过去的项目中一直存在不一致之处,因为我需要JSON数据结构,因此我会在随机位置(有时是客户端,有时是在后端)转换数据,有时是将其转换为某种方式,然后又返回。

是否有编码约定,应如何将数据提供给前端?

现在,我所有的数据都作为JSON传输到前端。将数据转换为前端或后端所需的格式是最佳实践吗?如果我需要JSON属性直接在客户端上进行进一步的计算怎么办?

我正在使用的技术:

  • 前端:Javascript / React
  • 后端:Javascript / Node.js + Java / Java Spring
克里斯·谢勒

是否有关于如何将数据传输到前端的编码约定

如果您的前端基于javascript,则JSON (Java脚本对象表示法)是最简单使用的形式,它是内存中对象字符串化版本。请参阅此健康讨论以获取有关JSON的更多信息

鉴于当今最流行的前端开发语言是javascript,(请参阅最新的技术调查),使用JSON格式在解决方案的后端之间传输数据是非常普遍且被广泛接受的。在非基于JavaScript的解决方案中使用JSON的决定会受到您所使用的开发和部署工具的影响,因为越来越多的开发人员正在使用javascript,我们的大多数工具都经过了一定程度的设计以支持javascript。

但是,使用其他结构化格式(例如XML)同样可以接受。

  • JSON通常比XML轻巧,因为传输有关模式的元数据的规定较少。对于内部数据流,在每次数据传输时都传输一个完全规范的XML模式可能是多余的,因此,在发送方和接收方之间数据结构不成问题的情况下,JSON是一个不错的选择。

  • XML是一种用于数据传输的更正式的格式,它可以包含完整的架构文档,该文档可以使接收者在很少或没有其他文档的情况下利用信息。

CSV或其他自定义格式可以减少通过电线发送的字节,但是在需要时很难以视觉方式检查数据,并且发送和接收端在格式化和解析数据方面都存在开销。

将数据转换为前端或后端所需的格式是最佳实践吗?

最佳实践是减少数据元素需要转换的次数。理想情况下,您不必在标签和数据属性名称之间进行转换...这也是使用JSON作为数据传输格式的主要原因。

因为JSON可以在javascript前端中本地解释,所以在javascript前端中,我们可以实质上减少转换为仅服务器端边界(在该边界上对数据进行序列化/反序列化)。实际上,前端根本没有任何转换。

如何通过属性名称而不是视觉标签来引用数据

在此空间中,公认的惯例是将数据模型与用户体验(视图)之间的关注点分开。重要的是,视图是最接近用户的图层,它表示数据模型的给定“视图”。

从抽象的意义上讲,很难为没有针对上下文提供任何语言或代码的OP量身定制代码解决方案,要应用此概念意味着不要尝试让数据模型携带有关如何显示数据的最终信息,而是您还有另一段代码可以提供显示数据所需的信息。

在不同的技术和平台中,我们以不同的方式提及此问题,但是通过以下设计模式始终如一地表示将模型从视图或表示中分离出来的核心概念:

对于OP的特定情况,这可能涉及如下映射结构:

customerStatsLabels: {
  ownedProducts: "Owned products",
  usedProducts: "Used products",
}

如果使用有关如何构建UI的一些代码来更新此问题,我将使用更具体的内容来更新此响应。

注意:

在javascript中,对象只是数组的数组,因此很容易将基于数组的现有代码调整为基于对象的代码,反之亦然。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何将参数前端匹配到后端 API

来自分类Dev

将后端集成到前端

来自分类Dev

带有后端API的前端内容-如何避免在后端API所在的位置进行硬编码?

来自分类Dev

如何将前端HTML / JQuery连接到后端Python

来自分类Dev

如何将数据从AngularJS前端传递到Nodejs后端?

来自分类Dev

BDD周期-如何将后端与前端连接

来自分类Dev

将后端与前端连接时已释放连接错误

来自分类Dev

我正在尝试将Azure后端与离子角前端连接

来自分类Dev

将文件从React.JS前端移动到C ++后端

来自分类Dev

使用Flask将Python后端与Flutter前端连接

来自分类Dev

将后端与前端连接时已释放连接错误

来自分类Dev

将数据从Vue前端传递到Node / Express后端

来自分类Dev

网站的API:使用API将后端和前端分开

来自分类Dev

我正在尝试将Azure后端与离子角前端连接

来自分类Dev

将函数调用识别为前端和后端之间的代理

来自分类Dev

将 zip 文件从 SailsJS 后端传送到 React Redux 前端

来自分类Dev

将后端项目获取到前端时出现 NoClassDefFoundError

来自分类Dev

使用 docker 容器将 Java App 中的前端与后端分开

来自分类Dev

如何将参数从 Jupyter 后端传递到前端扩展

来自分类Dev

将Paypal的IPN变量与后端变量匹配

来自分类Dev

无法将前端请求中的正文从前端发送到后端ReactJS

来自分类Dev

更好的做法是在后端准备html或将数据从后端发送到前端应用程序

来自分类Dev

检查前端和后端

来自分类Dev

前端和后端与快递

来自分类Dev

前端模板与后端模板

来自分类Dev

前端还是后端加密?

来自分类Dev

前端后端类交换

来自分类Dev

连接前端与后端

来自分类Dev

AWS 前端后端通信

Related 相关文章

热门标签

归档