一、面试题

问:开发的时候有用到过 Math 吗?

答:很多啊。比如生成 GUID 的时候,就会用到 Math.random() 来生成随机数。

问:别的呢?比如向下取整、向上取整?

答:向下取整是 floor(),向上取整是 ceil()。另外还可以用 round() 方法进行四舍五入的取整。

问:如果我需要四舍五入并保留两位小数,应该怎么处理呢?

答:可以直接用 toFixed() 方法,然后在方法中传入 2,以保留两位小数。

问:那数字 1.335 通过 toFixed(2) 计算后,结果是什么呢?

答:1.34 啊。

问:哦?那 0.1 + 0.2 等于多少呢?

答:阿咧?难道不是 0.3 么...

问:emmmmmm...

答:......

问:js 在处理十进制计算的时候,会先转为二进制,计算之后再转回十进制。如果这个数是浮点数,就很容易出现误差。

  

答:原来如此!

问:在了解了这个情况之后,你能写一个精确计算的方法么?

二、优化 toFixed()

由于二进制的原因,如果只是简单的放大缩小倍率,得到的结果都是不完美的

比如很多人推荐的:

Math.formatFloat = function (f, digit) {
var m = Math.pow(10, digit);
return Math.round(f * m, 10) / m;
}

在处理 8716.425 这个数的时候就会出错

经过多次尝试和查阅资料,我强烈推荐 Scott 大神的 toFixed() 方法,原链接:http://www.chengfeilong.com/toFixed

可以先手动找到舍入位,如果该位置大于5,则手动进位,并去掉舍入位及其后面的所有字符

Number.prototype.toFixed = function(length) {
var carry = 0; //存放进位标志
var num,multiple; //num为原浮点数放大multiple倍后的数,multiple为10的length次方
var str = this + ''; //将调用该方法的数字转为字符串
var dot = str.indexOf("."); //找到小数点的位置
if(str.substr(dot+length+1,1)>=5) carry=1; //找到要进行舍入的数的位置,手动判断是否大于等于5,满足条件进位标志置为1
multiple = Math.pow(10,length); //设置浮点数要扩大的倍数
num = Math.floor(this * multiple) + carry; //去掉舍入位后的所有数,然后加上我们的手动进位数
var result = num/multiple + ''; //将进位后的整数再缩小为原浮点数
/*
* 处理进位后无小数
*/
dot = result.indexOf(".");
if(dot < 0){
result += '.';
dot = result.indexOf(".");
}
/*
* 处理多次进位
*/
var len = result.length - (dot+1);
if(len < length){
for(var i = 0; i < length - len; i++){
result += 0;
}
}
return result;
}

这个方法我暂时没有发现有错误处理的数字。如果有小伙伴发现了,一定留言告诉我

在进行浮点数运算的时候,即使计算结果不精确,也可以用这个方法对结果进行四舍五入操作,得到最终结果

三、大数相加

在 js 中,对于超大整数的运算,还存在格式问题

当数字超出某个范围的时候,数字会自动转为科学计数法

这个时候如果还需要输出常规格式,就需要将数字转为字符串,然后实现一个字符串加法

function sumNumber(a, b) {
var res = '', temp = 0;
a = a.split('');
b = b.split('');
while (a.length || b.length || temp) {
temp += ~~a.pop() + ~~b.pop();
res = (temp % 10) + res;
temp = temp > 9;
}
return res.replace(/^0+/, '');
}

来源:https://www.cnblogs.com/kindofblue/p/4672129.html

这个方法的入参必须为整型的字符串,然后从个位开始,逐位相加,最后返回字符串

相关:

http://0.30000000000000004.com/

前端面试(原生js篇) - 精确运算的更多相关文章

  1. 前端面试(原生js篇) - DOM

    根据我的面试经历,一般小公司的面试环节,比较关心框架的熟练程度,以及独立开发组件的能力 但大厂通常有五轮以上的面试,而且对 js 基础语法很是看重 于是我总结了一些关于 js 基础的面试对话,有的当时 ...

  2. 2019前端面试系列——JS面试题

    判断 js 类型的方式 1. typeof 可以判断出'string','number','boolean','undefined','symbol' 但判断 typeof(null) 时值为 'ob ...

  3. 2019前端面试系列——JS高频手写代码题

    实现 new 方法 /* * 1.创建一个空对象 * 2.链接到原型 * 3.绑定this值 * 4.返回新对象 */ // 第一种实现 function createNew() { let obj ...

  4. 【面试问题】—— 2019.3月前端面试之JS原理&CSS基础&Vue框架

    前言:三月中旬面试了两家公司,一家小型公司只有面试,另一家稍大型公司笔试之后一面定夺.笔试部分属于基础类型,网上的复习资料都有. 面试时两位面试官都有考到一些实际工作中会用到,但我还没接触过的知识点. ...

  5. (转) 前端面试之js相关问题(一)

    原帖地址:http://stephenzhao.github.io/2016/08/19/Front-end-Job-Interview-Questions/ 最近我也是经历过面试别人和去面试的人了, ...

  6. 前端面试问题js汇总

    1.javascript的typeof返回哪些数据类型 Object number function boolean underfind 2,数组方法pop() push() unshift()shi ...

  7. 前端深入之js篇丨Array数组操作从入门到成神Up Up Up,持续更新中

    写在前面 随着前端深入的不断学习,发现数组这个数据结构在前端中有着相当大的存在感,由于我初学前端的时候并没有系统性的学习数组,所以我将通过这篇文章同你一起学习数组,希望我们能一起进步,学会熟练操作数组 ...

  8. js 数值精确运算使用math.js

    javaScript 浮点数运算的精度问题 问题:编程中你可能会遇到0.1*7=0.7000000000000001; 原因:几乎所有的编程语言都采用了 IEEE-745 浮点数表示法,任何使用二进制 ...

  9. web前端面试系列 - js中的prototype

    js中一切皆为对象,其中函数也是一种对象, 而每个函数都有一个prototype属性,其值也是一个对象. 一.prototype的作用 1. 在多个实例对象之间共享数据和方法. 2. 通过原型链实现继 ...

随机推荐

  1. MFC文件IO和串行化

    一. MFC中CFile对象实现了磁盘文档的读写,但是大部分MFC应用程序的IO服务都使用CArchive对象来完成.不管CFile和Archive输入输出的都是二进制数据,非文本数据. int a ...

  2. 移动端IM开发者必读(二):史上最全移动弱网络优化方法总结

    1.前言 本文接上篇<移动端IM开发者必读(一):通俗易懂,理解移动网络的“弱”和“慢”>,关于移动网络的主要特性,在上篇中已进行过详细地阐述,本文将针对上篇中提到的特性,结合我们的实践经 ...

  3. 阿里开源项目arthas在docker环境初始化

    需求 我前一篇是在window环境下做的测试,实际情况现在的生成环境程序都部署在了docker环境下,此环境对arthas可能会缺失很多必要组件 目前的基础环境是在docker容器中,只存在基本的to ...

  4. 学生管理系统(springMVC)

    <Java Web编程>课程设计                                                                               ...

  5. SpringBoot 遇到 com.google.guava » guava 组件运行异常问题修复方案

    环境 Apache Maven : 3.5.4 org.springframework.boot » spring-boot-starter-parent : 2.0.3.RELEASE io.spr ...

  6. 课程四(Convolutional Neural Networks),第二 周(Deep convolutional models: case studies) ——3.Programming assignments : Residual Networks

    Residual Networks Welcome to the second assignment of this week! You will learn how to build very de ...

  7. package.json文件中dependencies和devDependencies的区别

    在工作和学习中,我经常会用的npm 下载各种包,有时就会遇到各种npm 的形式,现在就捋一捋 首先要先了解   package.json文件中dependencies和devDependencies的 ...

  8. 源码安装redis环境

    linux下安装redis 1.下载源码,解压包后编译源码: wget http://download.redis.io/releases/redis-2.8.3.tar.gz tar xzf red ...

  9. 堆排序——HeapSort

    基本思想:   图示: (88,85,83,73,72,60,57,48,42,6)   平均时间复杂度: O(NlogN)由于每次重新恢复堆的时间复杂度为O(logN),共N - 1次重新恢复堆操作 ...

  10. SQL 必知必会·笔记<17>使用存储过程

    存储过程就是为以后使用而保存的一条或多条SQL 语句.可将其视为批文件,虽然它们的作用不仅限于批处理. 1. 存储过程的优点和缺点 存储过程的优点: 使用存储过程有三个主要的好处,即简单.安全.高性能 ...