文档章节

js中浮点型运算 bug的解决办法

Arthur126
 Arthur126
发布于 2015/12/09 11:27
字数 947
阅读 296
收藏 2

js中浮点型是如何运算的呢?

例如:var a=0.69;

我想得到6.9 直接这样写 var c=a*10;

alert(c);   得到结果是:6.8999999999999995

到网上一搜,有网友说这是一个JS浮点数运算Bug,找了解决方法:

方法一:有js自定义函数

/**
 * 校验是否为数字
 * @param arg
 * @return
 */
function checkIsNumber(arg){
    if(arg != null && arg.toString() != ""){
        var re = /^-?(0|[1-9]+\d*|[1-9]+\d*\.\d+|0\.\d+)$/;
        if(re.test(arg.toString())){
            return true;
        }
    }
    return false;
}

/**
 * 加法函数,用来得到精确的加法结果
 * 说明:javascript的加法结果会有误差,在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
 * 返回值注意:arg1和arg2可能是整数、浮点数、null、空字符串、其他字符串
 * @param arg1
 * @param arg2
 * @return
 */
function accAdd(arg1,arg2){
    if(!checkIsNumber(arg1) || !checkIsNumber(arg2)){
        return null;
    }
    var r1,r2,m;
    try{r1=arg1.toString().split(".")[1].length;}catch(e){r1=0;} 
    try{r2=arg2.toString().split(".")[1].length;}catch(e){r2=0;} 
    m=Math.pow(10,Math.max(r1,r2));
    return (arg1*m+arg2*m)/m;
}

// 给Number类型增加一个add方法,调用起来更加方便。
Number.prototype.add = function (arg){
    return accAdd(this,arg);
}

/**
 * 减法函数,用来得到精确的减法结果
 * 说明:javascript的减法结果会有误差,在两个浮点数相减的时候会比较明显。这个函数返回较为精确的减法结果。
 * 返回值:arg1-arg2的值,arg1和arg2可能是整数、浮点数、null、空字符串、其他字符串
 * @param arg1
 * @param arg2
 * @return
 */
function accSub(arg1,arg2){
    if(!checkIsNumber(arg1) || !checkIsNumber(arg2)){
        return null;
    }
    var r1,r2,m,n;    
    try{r1=arg1.toString().split(".")[1].length;}catch(e){r1=0;}    
    try{r2=arg2.toString().split(".")[1].length;}catch(e){r2=0;}
    m=Math.pow(10,Math.max(r1,r2));
    // n=(r1>=r2)?r1:r2; // 控制精度
    // return ((arg1*m-arg2*m)/m).toFixed(n);
    return (arg1*m-arg2*m)/m;
}

// 给Number类型增加一个subduct方法,调用起来更加方便。
Number.prototype.subduct = function (arg){
    return accSub(this,arg);
}

/**
 * 除法函数,用来得到精确的除法结果
 * 说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显。这个函数返回较为精确的除法结果。
 * 返回值:arg1除以arg2的精确结果
 * @param arg1
 * @param arg2
 * @return
 */
function accDiv(arg1,arg2){
    if(!checkIsNumber(arg1) || !checkIsNumber(arg2)){
        return null;
    }
    var t1,t2,r1,r2;
    try{t1=arg1.toString().split(".")[1].length;}catch(e){t1=0;} 
    try{t2=arg2.toString().split(".")[1].length;}catch(e){t2=0;}
    with(Math){
    r1=Number(arg1.toString().replace(".",""));
    r2=Number(arg2.toString().replace(".","")); 
    return (r1/r2)*pow(10,t2-t1); 
    } 
} 

// 给Number类型增加一个div方法,调用起来更加方便。
Number.prototype.div = function (arg){ 
    return accDiv(this,arg); 
} 

/**
 * 乘法函数,用来得到精确的乘法结果 
 * 说明:javascript的乘法结果会有误差,在两个浮点数相乘的时候会比较明显。这个函数返回较为精确的乘法结果。
 * 返回值:arg1乘以arg2的精确结果 
 * @param arg1
 * @param arg2
 * @return
 */
function accMul(arg1,arg2) {
    if(!checkIsNumber(arg1) || !checkIsNumber(arg2)){
        return null;
    }
    var m=0,s1=arg1.toString(),s2=arg2.toString(); 
    try{m+=s1.split(".")[1].length;}catch(e){}
    try{m+=s2.split(".")[1].length;}catch(e){} 
    return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m); 
} 

// 给Number类型增加一个mul方法,调用起来更加方便。
Number.prototype.mul = function (arg){ 
    return accMul(this,arg); 
} 
var a=0.69;var b=10;
alert(a*b);//6.8999999999999995alert((a*100)/10);

直接调用函数就可以。


方法二:如果在知道小数位个数的前提下,可以考虑通过将浮点数放大倍数到整型(最后再除以相应倍数),再进行运算操作,这样就能得到正确的结果了

alert(11*22.9);//得到251.89999999999998
alert(11*(22.9*10)/10);//得到251.9


本文转载自:http://www.cnblogs.com/wangkongming/archive/2013/01/18/2866788.html

共有 人打赏支持
Arthur126
粉丝 1
博文 33
码字总数 17900
作品 0
徐汇
高级程序员
私信 提问
JavaScript_note1

参考文献《JavaWeb 从入门到精通》 1.JavaScript的语法 JavaScript区分大小写 每行结尾的分号可有可无 变量是弱类型的 使用大括号标记代码块 与Java语言相同,JavaScript也是使用一对大括号标...

凌川江雪
07/10
0
0
JavaScript基础(二)变量和数据类型

javascript变量和数据类型 一、javascript命名规范 1. 严格区分大小写 2. 变量的命名必须以字母或 或 $开头,余下的部分可以是任意的字母,数字,或者是 或者是$ 3.不能用关键字或者是保留字...

曾杨
2013/12/25
0
0
JavaScript学习笔记(二)

JavaScript的数据类型分为:原始类型和对象类型。JavaScript中有两个特殊的原始值:null(空)和undefined(未定义)。 JavaScript中所有数字均用浮点数值表示。javaScript采用64位浮点格式表示数...

第五郎
2014/03/29
0
0
WebAssembly 时代,Rust 也想成为 Web 语言

目前 Mozilla 正在基于 WebAssembly 可移植代码格式研发 JavaScript 和 Rust 之间的桥梁——wasm-bindgen,意义是提高 JavaScript 和 Rust 之间的互操作性。Mozilla 这么做是想让 Rust 成为类...

开源中国
04/10
0
0
【JSConf EU 2018】WebAssembly 的手工艺术

在今年欧洲的JSConf上Emil Bay进行了一场题为《Hand-Crafting WebAssembly》的演讲。Emil表示:“现在已经有很多关于WebAssembly(WASM)的演讲。遗憾的是,大多数演讲是关于如何把高级语言编译...

leyayun
06/29
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Windows 环境下安装 Oracle JDK

本页面中描述了如何在 Window 环境下安装 Oracle JDK。 我们使用的版本是 Window 10,我们需要安装的版本是 Oracle JDK 8u191。 检查当前版本 在进行新的 JDK 安装之前,你需要检查下你本地的...

honeymose
11分钟前
0
0
用any-loader封装jQuery的XHR —— 随便写着玩系列

哎,都说没人用JQuery啦,叫你别写这个。 其实我也是好高骛远使用过npm上某个和某个很出名的XHR库,嗯,认识我的人都知道我喜欢喷JQ,以前天天喷,见面第一句,你还用JQ,赶紧丢了吧。但我也...

曾建凯
今天
4
0
聊聊storm的AggregateProcessor的execute及finishBatch方法

序 本文主要研究一下storm的AggregateProcessor的execute及finishBatch方法 实例 TridentTopology topology = new TridentTopology(); topology.newStream("spout1", spout......

go4it
今天
3
0
大数据教程(7.5)hadoop中内置rpc框架的使用教程

博主上一篇博客分享了hadoop客户端java API的使用,本章节带领小伙伴们一起来体验下hadoop的内置rpc框架。首先,由于hadoop的内置rpc框架的设计目的是为了内部的组件提供rpc访问的功能,并不...

em_aaron
今天
5
0
CentOS7+git+github创建Python开发环境

1.准备CentOS7 (1)下载VMware Workstation https://pan.baidu.com/s/1miFU8mk (2)下载CentOS7镜像 https://mirrors.aliyun.com/centos/ (3)安装CentOS7系统 http://blog.51cto.com/fengyuns......

枫叶云
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部