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 文件存入数据库，这样我们就可以统一维护一个表，不管是前端来处理数据还是后端来处理都能遵守相同的规则。

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