jJavaScript中toFixed()和正则表达式的坑
更新时间：2022年04月19日 17:18:39 作者：今天写注释了吗
这篇文章主要介绍了jJavaScript中toFixed()和正则表达式的坑，toFixed方法可以把Number四舍五入为指定小数位数的数字，具体详细内容需要的小伙伴可以参考一下
toFixed精度问题
toFixed方法可以把Number四舍五入为指定小数位数的数字。可是大家看下下面这张图，发现了什么？
0.985四舍五入之后变成了0.98！！
- 这就是toFixed方法的坑。
导致原因
那这到底是怎么回事呢？本质其实是因为js小数的精度问题。 在计算机中计算，是将数字转成二进制，进行计算之后再转化为十进制。 比如将0.985转化为二进制是0.1111110000101000（超出精度，结果保留了16位小数），此时再将该二进制转化为十进制结果为：0.9849853515625，此时将他保留两位小数就成了0.98。
解决办法
- 那么要如何避免这种问题呢？可以用下面的方法来补充原生的toFixed方法
toFixed(number, precision) {
var str = number + "";
var len = str.length;
var last = str.substring(len - 1, len);
var afterPoint = str.substring(str.indexOf(".") + 1, len);
if (last == "5" && afterPoint.length > precision) {
last = "6";
str = str.substring(0, len - 1) + last;
return (str - 0).toFixed(precision);
} else {
return number.toFixed(precision);
}
},
正则表达式全局匹配的坑
有这么一个需求，select支持可以搜索item。刚看到我就兴致冲冲去写了，这还不简单吗，输入的数据和select中的数据源进行正则匹配，匹配到的就是搜索到的。
过滤函数我是这么写的：
//searchKey是输入的数据
const regex = new RegExp(searchKey.trim(), 'gi');
let dataSource = [
{
value: 'test1',
},
{
value: 'test2',
},
];
let res = dataSource
.map((i) => {
let _flag = regex.test(i.value);
i.visible = _flag;
return i;
})
.filter((i) => i.visible);
但是实际运行时，发现数据源中的数据，有的可以匹配到有的匹配不到。当时就纳闷了，这有什么问题吗？最后几经查找答案，原来是正则表达式的全局匹配有个坑：正则表达式中有一个lastIndex的属性，这个属性表示上一次匹配文本结果之后的第一个字符的位置。他在下一次查找的时候，会从lastIndex往后继续查找，这就会导致一下个匹配返回false。
那么如何解决呢？
因为lastIndex属性是可读可写的，所以我这里的解决办法是每次test方法之后将将lastIndex置为零，这样每次匹配都将会从最开始进行查找。这样就会避免这个问题了哦！
let _flag = regex.test(i.value); regex.lastIndex = 0;
到此这篇关于jJavaScript中toFixed()和正则表达式的坑的文章就介绍到这了,更多相关toFixed()和正则表达式内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了JS去除字符串最后的逗号,结合实例形式分析了四种字符串遍历、截取的操作方法,需要的朋友可以参考下2019-06-06
实现的效果是当鼠标移到某一个标签的时候，在下面的内容区显示对应的内容，并且相应标签的颜色需要改变,这样的效果是CSS和JS配合实现的,下面我们就来看看具体代码2013-04-04
当一个元素上的事件被触发的时候，比如说鼠标点击了一个按钮，同样的事件将会在那个元素的所有祖先元素中被触发2013-01-01
下面小编就为大家带来一篇js enter键激发事件实例代码。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-08-08
这篇文章主要为大家详细介绍了JavaScript实现简单的树形菜单效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
这篇文章主要介绍了微信小程序下拉菜单效果的实例代码，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2019-05-05
下面介绍一下动态呼叫函数目前应该有下面两种方式，它们之间的使用及对比，感兴趣的朋友可以研究下，希望可以帮助到你2013-05-05
这篇文章主要为大家详细介绍了高斯模糊算法以及线性渐变的高斯模糊算法的原理,并通过一个小demo展示了如何实现y方向上线性渐变的高斯模糊效果,需要的可以了解下2024-01-01
断点调试是啥?难不难? 断点调试其实并不是多么复杂的一件事,简单的理解无外呼就是打开浏览器,打开sources找到js文件,在行号上点一下罢了,下面这篇文章主要给大家介绍了关于JS中6种打断点方式的相关资料,需要的朋友可以参考下2022-04-04
js控制台报错Uncaught TypeError: Cannot read p
本文主要介绍了js控制台报错Uncaught TypeError: Cannot read properties of undefined (reading ‘appendChild‘)的解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
最新评论