首页 > 其他分享 >js 加减乘除方法封装(处理精度问题)

js 加减乘除方法封装(处理精度问题)

时间:2022-12-06 17:47:11浏览次数:41  
标签:封装 r1 val arg1 arg2 js r2 toString 加减乘除

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
</head>
<body>
    <input type="text" value=""  id="param1"/>
    <select style="width:50px;" id="type">
        <option value="1">+</option>
        <option value="2">-</option>
        <option value="3">*</option>
        <option value="4">/</option>
    </select>
    <input type="text" value="" id="param2" />
    =
    <input type="text" id="rel" />
    <input type="button" value="calculate"  onclick="calculate()" />
    <script>
        function calculate() {
            var type = $('#type').val();
            if (type == '1') {
                $('#rel').val(accAdd($('#param1').val(), $('#param2').val()));
            }
            if (type == '2') {
                $('#rel').val(accSub($('#param1').val(), $('#param2').val()));
            }
            if (type == '3') {
                $('#rel').val(accMul($('#param1').val(), $('#param2').val()));
            }
            if (type == '4') {
                $('#rel').val(accDiv($('#param1').val(), $('#param2').val()));
            }
        }
    </script>
    <script>

        //加法函数,用来得到精确的加法结果
        //说明:javascript的加法结果会有误差,在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
        //调用:accAdd(arg1,arg2)
        //返回值:arg1加上arg2的精确结果
        function accAdd(arg1, arg2) {
            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(arg, this);
        }

        //加法函数,用来得到精确的加法结果
        //说明:javascript的加法结果会有误差,在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
        //调用:accAdd(arg1,arg2)
        //返回值:arg1加上arg2的精确结果
        function accSub(arg1, arg2) {
            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));
            //last modify by deeka
            //动态控制精度长度
            n = (r1 >= r2) ? r1 : r2;
            return ((arg1 * m - arg2 * m) / m).toFixed(n);
        }

        //除法函数,用来得到精确的除法结果
        //说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显。这个函数返回较为精确的除法结果。
        //调用:accDiv(arg1,arg2)
        //返回值:arg1除以arg2的精确结果
        function accDiv(arg1, arg2) {
            var t1 = 0, t2 = 0, r1, r2;
            try { t1 = arg1.toString().split(".")[1].length } catch (e) { }
            try { t2 = arg2.toString().split(".")[1].length } catch (e) { }
            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的乘法结果会有误差,在两个浮点数相乘的时候会比较明显。这个函数返回较为精确的乘法结果。
        //调用:accMul(arg1,arg2)
        //返回值:arg1乘以arg2的精确结果
        function accMul(arg1, arg2) {
            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(arg, this);
        }
    </script>
</body>
</html>

 

标签:封装,r1,val,arg1,arg2,js,r2,toString,加减乘除
From: https://www.cnblogs.com/PrintY/p/16955976.html

相关文章

  • JS之BOM/DOM和jquery类库简介
    目录BOM操作DOM操作查找标签操作节点获取值操作class与css操作事件事件实战案例jQuery类库标签对象与jQuery对象BOM操作JavaScript分为ECMAScript,DOM,BOMBOM(BrowserObj......
  • 2022-12-06 js 如何正确富文本中的字号
    编辑内容,提交,后端以富文本形式返回,内容假设为 "<p><b><fontsize="7">标题</font></b></p>"我们可以看到里面有一个size="7",对应着富文本里面的字号48px。由此得知,你......
  • 今日JS解密日记
    干货从来不废话,直接上源代码,源码很大,单拎一个函数出来function_0x486eb9(_0xfeca11,_0x4a4275){if(!_0xfeca11)return!![];if(!_0xfeca11['\x63\x6c\x69\x65......
  • [c++11新特性]09-chrono的使用与封装
    时间类的简介​时间类的简介​​​duration简介​​​​借助chrono实现的定时器​​​​time_point​​​时间类的封装​​​时间格式化​​​​日期变化​​duration简......
  • jsdelivr被墙,hexo-next切换为自定义CDN
    1.Next主题需要升级到8.9以上,我的是多少忘记了,最好升级到最新使用npm管理gitclonehttps://github.com/next-theme/hexo-theme-nextthemes/next2.替换链接官方......
  • 03.Nodejs中的路由与接口
    路由与接口目录目录路由与接口express基本使用托管静态资源nodemonExpress中的路由路由的匹配路由的使用模块化路由Express中间件中间件的格式全局生效的中间件局部生效......
  • 04.Nodejs操作MySQL
    在Nodejs中操作MySQL数据库目录在Nodejs中操作MySQL数据库MySQL数据库SQL的基本使用SELECT语句INSERTINTO语句UPDATE语句DELETE语句WHERE子句AND与OR运算符ORDERBY子......
  • 05.Nodejs_web开发模式
    Web开发目录目录Web开发Web开发模式服务端渲染的传统Web开发模式前后端分离的Web开发模式Session认证机制在项目中使用Session向session中存入数据:从session中获取数......
  • 00.Nodejs环境搭建
    Nodejs的环境搭建目录Nodejs的环境搭建安装node搭建服务器环境查看本地ip项目复活安装node英文官网:https://nodejs.org/en/中文官网下载node地址https://nodejs.or......
  • JS复制文本方法总结
    1.document.execCommand()【即将废弃】functioncopy(textValue){//动态创建textarea标签consttextarea=document.createElement('textarea')//将该......