Angular由一个bug说起之八:实践中遇到的一个数据颗粒度的问题

互联网产品离不开数据处理,数据处理有一些基本的原则包括:准确性、‌完整性、一致性、保密性、及时性

  • 准确性是数据处理的首要目标,确保数据的真实性和可靠性。准确的数据是进行分析和决策的基础,因此,在数据处理过程中应采取措施确保数据的准确性,如建立数据验证机制,检查数据输入错误等。
  • 完整性指的是数据应当涵盖所有相关变量和维度,没有遗漏或缺失。如果数据不完整,可能会导致分析时的偏差和误差,因此应采取措施确保数据的完整性,如使用数据清洗工具清理数据,填补缺失值等。
  • 一致性意味着数据在不同的时间和地点应保持一致。数据的一致性对于确保分析结果的可靠性至关重要,应采取措施如使用统一的数据格式和命名规范,进行数据标准化等。
  • 保密性要求数据应根据相关法律法规和隐私政策进行保护。在处理敏感的个人信息或商业机密时,应采取措施保护数据,如限制数据访问权限,加密敏感数据等。
  • 及时性强调数据应在需要时及时提供和更新。过时的数据无法支持及时的决策和分析,因此应确保数据的及时性,如建立定时更新的数据采集和处理流程,‌及时反馈数据结果等。

我在最近的项目中就遇到了一个关于 准确性 完整性 的问题。

具体是这样:我们项目中有使用各种 Chart 来展示数据的功能,这些数据根据不同的类型和单位会为其加上前缀、后缀或者省略小数。比如:type = percent 数据后加 %type = integer 数据不能有小数位,type = currency 数据前加 $ 等等。

问题出在 percent类型 的数据,有些数据如果按百分比来计算通常不会大于 1%,比如彩票中一等奖的概率。这个时候如果要比较两个数据选出具有更优表现的数据,小数点就需要多保留一到两位。

举个例子,假如百分比保留1位小数。同样是省略后 0.1% 的两个数据,一个 0.01% 另一个 0.04%,两者的差距可能是很大的。

如下图,虽然数据很小但是表现在 Chart 上差距是很明显

我们目前的解决方案是判断数据如果 0.0% < X < 0.1% 就保留两位小数,其余情况保留一位小数。

function formatPercentRounding(data) {const value = data, result = '0.0%';// 0.0% < X < 0.1%const decimalDigits = (value > 0 && value * 1000 < 1) ? 2 : 1;if (value) {result = (Math.round(value * 1000)/10).toFixed(decimalDigits) + '%';}return result;
}

之所以使用这种比较直接的方式是因为项目中的数据类型已经确定,而且对数字的处理逻辑没有统一在一个文件中。这是大型项目经常遇到的问题,起到相同作用的代码因为一些小的差别而分别写在管理各自功能的文件里。

如果项目重构这些都是需要优化的地方。针对这篇文章提到的数字缩写的问题,可以有两种处理方案。

一种是维护一个 config.json,如:

[{chart: 'bar',numberRules: [{type: 'integer',decimalDigits: 0},{type: 'percent',decimalDigits: 2,suffix: '%'}]},{chart: 'grid',numberRules: [{type: 'currency',decimalDigits: 1,prefix: '$'},{type: 'percent',decimalDigits: 3,suffix: '%'}]},...
]

或者将代码放在一个统一的方法中处理:

const method = (chartType, data) => {let decimalDigits = 1;switch (chartType) {case 'grid':decimalDigits = 2;...break;...default:break;}return data.toFixed(decimalDigits);
}

两种方法都能解决问题,但是推荐第一种。我们可以直接把 config 文件存入数据库,这样我们就可以统一维护一个表,不管是前端来处理数据还是后端来处理都能遵守相同的规则。

以上就是我在实践中遇到的关于数据颗粒度的一个小问题以及对它的思考,谢谢

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

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

相关文章

【目标检测】非极大值抑制(Non-Maximum Suppression, NMS)步骤与实现

步骤 置信度排序&#xff1a;首先根据预测框的置信度&#xff08;即预测框包含目标物体的概率&#xff09;对所有预测框进行降序排序。选择最佳预测框&#xff1a;选择置信度最高的预测框作为参考框。计算IoU&#xff1a;计算其他所有预测框与参考框的交并比&#xff08;Inter…

【数据结构】建堆算法复杂度分析及TOP-K问题

【数据结构】建堆算法复杂度分析及TOP-K问题 &#x1f525;个人主页&#xff1a;大白的编程日记 &#x1f525;专栏&#xff1a;数据结构 文章目录 【数据结构】建堆算法复杂度分析及TOP-K问题前言一.复杂度分析1.1向下建堆复杂度1.2向上建堆复杂度1.3堆排序复杂度 二.TOP-K问…

深度学习1-简介

人工智能&#xff08;AI&#xff09;旨在打造模仿智能行为的系统。它覆盖了众多方法&#xff0c;涵盖了基于逻辑、搜索和概率推理的技术。机器学习是 AI 的一个分支&#xff0c;它通过对观测数据进行数学模型拟合来学习决策制定。这个领域近年来迅猛发展&#xff0c;现在几乎&a…

前端地位蹭蹭蹭Up!!!

作者&#xff1a;溪饱鱼 链接&#xff1a;juejin.cn/post/7283642910301192244 顺便吆喝一句&#xff0c;如果你本科学历&#xff0c;对技术大厂有向往&#xff0c;对前后端测试岗位有兴趣&#xff0c;不对大厂外包有100%的排斥&#xff0c;可以看看这里&#xff0c;薪酬待遇确…

Ruby语言详解

Ruby语言详解 Ruby&#xff0c;作为一种简单快捷的面向对象脚本语言&#xff0c;自20世纪90年代由日本人松本行弘&#xff08;Yukihiro Matsumoto&#xff09;开发以来&#xff0c;便以其独特的魅力和强大的功能赢得了全球开发者的青睐。Ruby不仅继承了Perl、Smalltalk、Eiffe…

​ ​【Linux】-----工具篇(多模式编辑器vim介绍及配置)

目录 认识常用三种模式 基本操作 Ⅰ、进入/打开vim Ⅱ、模式转换 Ⅲ、退出vim 命令集 Ⅰ、命令模式下 移动光标 删除文字 复制 替换 撤销 批量化注释 批量化去注释 Ⅱ、底行模式下 列出行号 跳转至指定行 查找字符 保存文件 退出vim 查看文件 分屏操作 vim的简…

论文阅读:面向自动驾驶场景的多目标点云检测算法

论文地址:面向自动驾驶场景的多目标点云检测算法 概要 点云在自动驾驶系统中的三维目标检测是关键技术之一。目前主流的基于体素的无锚框检测算法通常采用复杂的二阶段修正模块,虽然在算法性能上有所提升,但往往伴随着较大的延迟。单阶段无锚框点云检测算法简化了检测流程,…

CUE-云原生配置语言

CUE 是一种服务于云化配置的强类型配置语言&#xff0c;由 Go team 成员 Marcel van Lohiuzen 结合 BCL 及多种其他语言研发并开源&#xff0c;可以说是 BCL 思路的开源版实现CUE 是一种服务于云化配置的强类型配置语言&#xff0c;由 Go team 成员 Marcel van Lohiuzen 结合 B…

AI OS

一&#xff0c;概念 AI OS, 或AI for OS&#xff0c;也就是近一年来伴随着人工智能的热度而衍生出的一个新的概念 - 人工智能操作系统。 为什么提出AI OS的概念&#xff1f; 这是因为人工智能技术的发展势头太过迅猛&#xff0c;尤其在深度学习、大模型等AI技术的突破后&…

微信小程序:vant-weapp 组件库、css 变量

vant-weapp 组件库 前往 vant-weapp 官网 npm 使用限制&#xff1a;不支持依赖于 Node.js 内置库、浏览器内置对象、C 插件 的包。 安装 vant-weapp # 通过 npm 安装 npm i vant/weapp -S --production# 通过 yarn 安装 yarn add vant/weapp --production# 安装 0.x 版本 npm i…

Mac环境报错 error: symbol(s) not found for architecture x86_64

Mac 环境Qt Creator报错 error: symbol(s) not found for architecture x86_64 错误信息 "symbol(s) not found for architecture x86_64" 通常是在编译或链接过程中出现的问题。这种错误提示通常涉及到符号未找到或者是因为编译器没有找到适当的库文件或函数定义。 …

powe bi界面认识及矩阵表基本操作 - 1

powe bi界面认识及矩阵表操作 1. 界面认识1.1 选择数据源1.2 选择相关表及点击加载1.3 表字段显示位置1.4 表属性按钮位置1.5 界面布局按钮认识 2. 矩阵表基本操作2.1 选择矩阵表2.2 创建矩阵表2.3 设置字体大小2.4 行填充&#xff1a;修改高度2.5 列宽&#xff1a;设置列的宽度…

【下厨记】青椒土豆丝的做法和写代码之间的关系

在gap year 的尾声&#xff0c;我决定给自己报个厨艺培训班&#xff0c;精进一下厨艺。讲道理&#xff0c;在这样一个充斥着代码的社区写怎么做土豆丝是不是很不搭界&#xff0c;但其实没有&#xff0c;且听我娓娓道来。论&#xff0c;青椒土豆丝做法和写代码之间的关系。 1.找…

git怎么把本地仓库提交到远程仓库

要把本地仓库的内容推送到远程仓库&#xff0c;你需要先设置远程仓库的URL&#xff0c;然后使用git push命令。以下是步骤和示例代码&#xff1a; 1、在本地创建一个新的git仓库或者进入一个已存在的git仓库目录。 2、添加远程仓库&#xff08;如果尚未添加&#xff09;。使用…

使用RedisTemplate操作executePipelined

前言 RedisTemplate 是 Spring 提供的用于操作 Redis 的模板类&#xff0c;它封装了 Redis 的连接、连接池等管理&#xff0c;并提供了一系列的操作方法来简化 Redis 的使用。其中&#xff0c;executePipelined 方法是 RedisTemplate 中的一个高级特性&#xff0c;用于支持 Re…

【Python实战因果推断】55_因果推理概论5

目录 Consistency and Stable Unit Treatment Values Violations Causal Quantities of Interest Consistency and Stable Unit Treatment Values 在上述方程中&#xff0c;隐含着两个基本假设。第一个假设意味着潜在结果与处理是一致的&#xff1a;当时&#xff0c;。换句…

为什么有了MAC还需要IP?

目录 MAC地址&#xff08;Media Access Control Address&#xff09;IP地址&#xff08;Internet Protocol Address&#xff09;为什么需要两者&#xff1f; IP地址和MAC地址在网络通信中扮演着不同的角色&#xff0c;它们各自有独特的功能和用途。下面是它们的主要区别和为什么…

VitePress Config.mts 详细讲解

VitePress 是一个基于 Vite 的静态站点生成器&#xff0c;专为技术文档和博客设计。它继承了 Vite 的快速开发体验&#xff0c;并提供了一套简洁的配置选项。在本文中&#xff0c;我们将深入探讨 VitePress 的 config.mts 配置文件&#xff0c;这是中高级开发者定制站点的关键所…

详解Vue中nextTick的原理与作用

Vue中的nextTick是一个非常重要的API&#xff0c;它允许开发者延迟回调函数的执行直到下次DOM更新循环之后。这一机制在Vue开发中非常有用&#xff0c;特别是在处理DOM更新和异步操作时。下面将详细解释nextTick的原理与作用。 原理 Vue的DOM更新是异步进行的。当数据发生变化…

Vue3相比于Vue2进行了哪些更新

1、响应式原理 vue2 vue2中采用 defineProperty 来劫持整个对象&#xff0c;然后进行深度遍历所有属性&#xff0c;给每个属性添加getter和setter&#xff0c;结合发布订阅模式实现响应式。 存在的问题&#xff1a; 检测不到对象属性的添加和删除数组API方法无法监听到需要对…