龙空技术网

技术内参|数据分析,如何解决精度丢失的问题?

神策数据 96

前言:

现在同学们对“js中精度问题怎么解决”大致比较看重,咱们都想要剖析一些“js中精度问题怎么解决”的相关资讯。那么小编同时在网络上网罗了一些有关“js中精度问题怎么解决””的相关知识,希望朋友们能喜欢,姐妹们一起来了解一下吧!

本文由神策数据技术大咖皮成投稿

谈到大数据技术,数据采集和计算是永远绕不开的话题,采集的准确度、计算的精度都是做数据分析的前提条件。

神策数据服务的客户覆盖互联网各个细分领域,其中不乏有做目前大火的虚拟货币的客户,比如涉及区块链和比特币领域的客户,从接触之初,他们对大数据工具的要求就极其严苛,当然,这与虚拟货币自身的特点也分不开。

事实上,每个虚拟货币的精确程度小到小数点后 4 位,大到小数点后 12 位。客户在分析用户每次成交的货币量,每日的人均成交货币量等指标,或者在分布分析中查看比持币的分布情况时,常常是需要精确到小数点后 8 位甚至更多。

因为虚拟货币的单价不同,更高的精确度可以让客户更加精准的细分出用户群,进而进行更深度的分析。高精度确保了分析结果的准确性,甚至决定了虚拟货币企业的核心竞争力。

所以,虚拟货币企业对精度的要求极高也不足为奇了。不过,在用 JavaScript 开发数据可视化产品时,会遇到数值的展现和计算丢失精度的问题,这是很多技术者想要解决的难题。下面我们从两方面来为你解决这个问题:

一、为什么会出现精度的丢失?

二、如何解决精度丢失问题?

下面我们先介绍下计算精度的背景:

1. 二进制小数

在十进制中,123.45 可以表示为 1 × 10² + 2 × 10¹ + 3 × 10⁰ + 4 × 10⁻¹ + 5 × 10⁻² = 123 ⁴⁵⁄₁₀₀,小数点的位置决定了数字的权重,左边的数是 10 的正幂,右边的数是 10 的负幂。

类似,二进制数 101.11 也可以表示为 1 × 2² + 0 × 2¹ + 1 × 2⁰ + 1 × 2⁻¹ + 1 × 2⁻² = 4 + 0 + 1 + ¹⁄₂ + ¹⁄₄ = 5 ³⁄₄,小数点向左移动一位相当于这个数被 2 除,小数点向右移动一位相当于这个数乘以 2。

在有限的长度下,十进制无法准确表示像 ¹⁄₃、⁵⁄₇ 这样的数,二进制也无法准确表示像 ¹⁄₅ 这样的数,增加数字的长度可以提高表示的精度。

2. IEEE 745 标准

IEEE 745 定义了在计算机中浮点数的表示及其运算的标准,标准指定了两种基本浮点格式:单精度和双精度,两种扩展浮点格式:单精度扩展和双精度扩展。

浮点格式是一种数据结构,用于指定包含浮点数的字段、这些字段的布局及其算术解释。浮点存储格式指定如何将浮点格式存储在内存中,具体选择哪种存储格式由实现工具决定,JavaScript 采用的是 IEEE 745 双精度浮点格式。

IEEE 浮点标准用 V = (−1)ˢ × 2ᴱ × M 的形式来表示一个数:

· 符号(sign)s 决定这个数是正数 s = 0 还是负数 s = 1。

· 指数(exponent)E 的作用是对浮点数的加权,权重是 2 的 E 次幂。

· 尾数(significand)M是一个二进制小数。

如下图所示,表示浮点数的位划分为三个字段:

· 一个符号位 s。

· k 位的指数字段 exp = eᵏ⁻¹ ... e¹e⁰ 编码指数 E。

· n 位的小数字段 frac = f⁻¹f⁻² ... f⁻ⁿ编码尾数 M。

图中给出了两种最常见的格式,32位的单精度格式:1 位符号位、k = 8 的指数字段、n = 23 的小数字段,64 位的双精度格式:1 位符号位、k = 11 的指数字段、n= 52 的小数字段。

3. IEEE 浮点格式转为十进制数

浮点格式要形成最终表示的值 V= 2ᴱ × M,需要对各个字段作如下处理:

· 指数 E = e - Bias,e表示为 eᵏ⁻¹ ... e¹e⁰,Bias 是一个等于 2ᵏ⁻¹ - 1 的偏移量。

· 小数字段 frac = f⁻¹f⁻² ... f⁻ⁿ,尾数 M = 1 + frac。

另外还有两种情况:

· 当指数字段全为 0 时,指数值是1 - Bias,尾数值是 M = frac。

· 当指数字段全为 1 时,小数字段全为 0 表示无穷,小数字段不等于 0 表示NaN。

下面以 8 位浮点格式为例介绍如何将其转为十进制数。

如:0 0110 110,其中有 k = 4 的指数字段和 n = 3 的小数字段,各个部分的处理如下:

· 偏移量 Bias = 2⁴⁻¹ - 1 = 7。

· 指数字段 e = 0 × 2³ + 1 × 2² + 1 × 2¹ + 0 ×2⁰ = 6。

· 指数 E = 6 - 7 = -1。

· 小数字段 frac = 1 × 2⁻¹ + 1 × 2⁻² + 0 × 2⁻³ = ³⁄₄。

· 尾数 M = 1 + ³⁄₄ = ⁷⁄₄。

· 最终值:V = 2ᴱ × M = 2⁻¹ × ⁷⁄₄ = ¹⁄₂ × ⁷⁄₄ = ⁷⁄₈ = 0.875。

上面是精度计算的一些背景知识,下面我们来解答前面提到的两个问题:

一、为什么会出现精度的丢失?

表示方法限制了浮点数的范围和精度,所以浮点运算只能近似的表示实数运算。

IEEE 浮点格式定义了 4 种不同的舍入方式:

· Round-to-even,向偶数舍入,将数字向上或向下舍入,使得结果的最低有效数字是偶数,如以十进制数为例:1.5 和 2.5 都将舍入为 2。

· Round-toward-zero,向零舍入,把正数向下舍入,负数向上舍入。

· Round-down,向下舍入,把正数、负数都向下舍入。

· Round-up,向上舍入,把正数、负数都向上舍入。

JavaScript 中的浮点数有两种来源,由服务端返回的数据或者通过运算产生的结果,从服务端返回数据到前端展现会经过下面几个环节:

在这个过程中,需要解决 JSON 解析丢失精度的问题、高精度浮点数运算的问题、高精度浮点数展示的问题。

在 JavaScript 中通常会用 number 数据类型来保存数值、进行数值的运算,但由于 IEEE 浮点格式的限制,用 number 类型保存一个大浮点数时,精度会丢失。

const num = 106119.43448475052345678

// 106119.43448475053

同样,我们常用的JSON.parse 方法解析 JSON 字符串时,大浮点数的精度也会丢失。

const data = JSON.parse('{"values":[106119.43448475052345678,755180144.3253138888456,3086.27072845812345678]}');

// {

// values: [

// 106119.43448475053,

// 755180144.3253139,

// 3086.2707284581234

// ]

// }

二、如何解决精度丢失问题?

要确保从服务端获取的大浮点数精度不丢失,就不能用 JSON.parse 方法来解析 HTTP Response Body 里的 JSON 字符串,也不能直接用 number 类型来保存数值。

解析 JSON 时可以把数值保存为 string 类型:

const data = {

values: [

'106119.43448475052345678',

'755180144.3253138888456',

'3086.27072845812345678'

]

};

JSON 解析可以用第 3 方库,如:

要对高精度浮点数进行运算,首先要将其转为便于运算的结构,如:

// '106119.43448475052345678'

let num = {

// 数值拆成数组

c: [106119, 43448475052345, 67800000000000],

// 标识数值的指数

e: 5,

// 标识数值的正负

s: 1

};

// '3086.27072845812345678'

let num2 = {

c: [3086, 27072845812345, 67800000000000],

e: 3,

s: 1

};

转为如上结构后,再对数组中的各段数值进行运算。

高精度数值运算可以使用第 3 方库,如:

高精度浮点数在网页中的展示有所不同,具体如下:

浮点数在页面上的展示通常有两种方式,创建为一个文本节点、通过 Canvas 或 SVG 画成图表。

创建为文本节点来展示没有什么问题,如:

document.createTextNode('106119.43448475052345678');

// 或

let div =document.createElement('div');

div.innerText = '106119.43448475052345678';

画图表通常会用到第 3 方库,如:ECharts、G2 等,各种图表的具体实现上会依赖数值的比较、四则运算等,目前 ECharts、G2 还没有对大浮点数的支持。

看完上文是不是学到很多?

想要深入了解的小伙伴,欢迎来撩神策数据的技术小哥哥,各个身怀绝技哦!

PS:此篇文章就是技术小哥哥皮成的经验分享

与凤凰同飞,必是俊鸟;与虎狼同行,必是猛兽!

来神策数据,你不变优秀,我输一包辣条!

对,我们正在寻找优秀的你!

快来加入我们吧!

热招岗位

大数据前端工程师

JS 数据采集方向:

1、负责神策 JS SDK 的开发,维护,客户支持;

2、负责前端相关数据采集方案的调研和开发,比如微信小程序,支付宝等。

数据可视化方向:

1、负责数据分析产品的 Web 前端研发;

2、与产品设计师一起,优化整个产品的使用流程,为使用者提供更好的数据可视化效果;

3、负责前端新技术的探索与实践。

我们的挑战:

1、单页面复杂 Web 应用,需要管理 10 万行业务代码,代码量还在快速增长中;

2、与大量数据打交道,需要对数据业务有深层次的理解;

3、服务大量客户,产品快速迭代的同时,要让系统在健康的轨道上发展。

对工程师的要求:

1、熟练掌握 HTML/CSS/JavaScript 等前端基础技术;

2、能写出高质量的代码,有良好的代码风格、了解各种设计模式;

3、React/Vue/Angular 技术栈至少掌握其中一种,对背后的设计思路应该比较了解,读源码应该没什么困难;

4、对写代码之外的事情能熟练运用各种工程工具处理,对工具背后的工作原理应该有一些了解;

5、10 万行代码在浏览器里运行,性能方面是个挑战,怎么分析、优化性能应该有一定的了解;

6、很好的业务理解能力,与大数据打交道,需要理解的不只是页面上有哪些 UI 组件。

关于简历,我们想看到的:

1、做过的最牛的项目,用到了什么技术、实现了什么功能、有什么收获。

2、写过的最牛的代码。

如果想用前端技术做一些有趣、有挑战的事情,欢迎给我们简历!

如果没有开发过复杂 Web 应用,但对自己的学习能力足够自信,欢迎给我们简历!

划重点

【工作地点】北京

【应聘方式】简历可发送至邮箱 :hr@sensorsdata.cn

Hr 小姐姐都很美哦!欢迎来撩~

更多岗位可点击下方了解更多,在官网了解

参考资料:

·IEEE 754,

·Numerical Computation Guide,

· 《深入理解计算机系统》

标签: #js中精度问题怎么解决 #json 精度丢失