当前位置：首页 > article >正文

前端大数字精度丢失？Choerodon UI 大数字解决方案：精确性与灵活性的结合！

article 2024/12/22 21:44:36

在这里插入图片描述

01 引言

在企业项目开发中，数据的精确性是关键。Choerodon UI 的大数字解决方案，通过其高精度计算、数据一致性维护、灵活的数据交互、国际化支持、兼容性保障、定制化格式化等优势，为开发人员提供了一个强大的武器库，以确保在处理复杂和庞大的科学数据时，能够获得可靠和精确的结果。这不仅简化了开发流程，还提高了数据处理的性能。

02 Choerodon UI 大数字特性

高精度计算：
使用 BigNumber 库，Choerodon UI 能够精确处理非常大的数字，这对于科学计算中常见的大数运算至关重要，可以避免浮点数运算中的精度损失。
数据一致性：
在数据集（DataSet）中， BigNumber 字段类型确保了所有大数字数据始终以 BigNumber 对象的形式处理，这有助于在整个应用程序中保持数据的一致性和准确性。
灵活的数据交互：
Choerodon UI 提供了与后端数据交互时处理大数字的解决方案，无论是通过全局替换 JSON 处理库，还是通过特定的库（如 json-bigint ）来确保在数据传输过程中大数字的精度不被丢失。
国际化支持：
Choerodon UI 的大数字解决方案支持国际化，这意味着它可以根据不同地区的格式要求来正确显示和处理大数字，这对于全球性的科学研究和数据共享非常有用。
兼容性：
通过扩展 BigNumber 对象，Choerodon UI 确保了与现有 JavaScript 工具库（如 Lodash）的兼容性，使得开发者可以在使用大数字的同时，不牺牲现有的代码逻辑和功能。
定制化格式化：
Choerodon UI 允许开发者定制 BigNumber 的 toFixed 和 toFormat 方法，以确保大数字的格式化输出与原生数字一致，这对于生成报告和可视化科学数据非常有用。
简化开发流程：
通过提供一套完整的大数字处理工具，Choerodon UI 简化了开发流程，使得开发者可以专注于科学计算的逻辑，而不必担心底层的数据精度问题。

大数字在组件库中的灵活应用

Choerodon UI 的数字、货币输入框组件支持大数字显示。

如何应用：

字段类型 ‘bigNumber’： Choerodon UI 的 DataSet 的字段提供了 bigNumber 类型。普通的 number 字段类型数字组件的输入会根据数字是否溢出自动在 number 和 BigNumber 之间转换, 而 bigNumber 字段类型的数据始终是 BigNumber 对象。
远程数据交互： 通过使用 json-bigint 保护 JSON 交互期间的数据完整性。这个库将 JSON 中的大数字转换为 BigNumber 对象，确保数据传输期间的精度。

注意：json-bigint v1.0.0 版本转换的对象有原型链丢失的issue, 在该 issue 修复前请使用 v0.4.0 版本。

大数字计算示例

Choerodon UI 大数字方案，使用的第三方 bignumber.js 库，组件库基于此封装了大数字计算方法库 “math”。

1. 精确计算

通过 math.plus 和 math.minus 告别浮点数、JS 精度误差，确保大数字计算、 0.1 + 0.2 的 JS 计算精度问题。

2. 无缝集成

在组件回调方法中， value 允许传递字符串或 BigNumber 对象， onChange 钩子参数值可能是数字也可能是大数字, 为了便捷后续的运算，请使用 choerodon ui 的 math 库。
支持字符串和 BigNumber 对象值的 NumberField 组件，将大数字集成到您的系统中，保持数据的一致性和无误。

3. 示例

// 引入方法
import { math } from 'choerodon-ui/dataset';
// 基本使用// 
0.1 + 0.2 => 0.30000000000000004
math.plus(0.1, 0.2);  // 0.3

// 9007199254740992 + 1 => 9007199254740992
math.plus('9007199254740992', 1);  // BigNumber(9007199254740993)

// 9007199254740993 - 1 => 9007199254740991
math.minus('9007199254740993', 1);  // BigNumber(9007199254740992)