jJavaScript中toFixed()和正則表達(dá)式的坑
toFixed精度問題
toFixed方法可以把Number四舍五入為指定小數(shù)位數(shù)的數(shù)字?？墒谴蠹铱聪孪旅孢@張圖，發(fā)現(xiàn)了什么？
0.985四舍五入之后變成了0.98??！
- 這就是toFixed方法的坑。
導(dǎo)致原因
那這到底是怎么回事呢？本質(zhì)其實(shí)是因?yàn)閖s小數(shù)的精度問題。 在計(jì)算機(jī)中計(jì)算，是將數(shù)字轉(zhuǎn)成二進(jìn)制，進(jìn)行計(jì)算之后再轉(zhuǎn)化為十進(jìn)制。 比如將0.985轉(zhuǎn)化為二進(jìn)制是0.1111110000101000（超出精度，結(jié)果保留了16位小數(shù)），此時(shí)再將該二進(jìn)制轉(zhuǎn)化為十進(jìn)制結(jié)果為：0.9849853515625，此時(shí)將他保留兩位小數(shù)就成了0.98。
解決辦法
- 那么要如何避免這種問題呢？可以用下面的方法來補(bǔ)充原生的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);
}
},
正則表達(dá)式全局匹配的坑
有這么一個(gè)需求，select支持可以搜索item。剛看到我就興致沖沖去寫了，這還不簡(jiǎn)單嗎，輸入的數(shù)據(jù)和select中的數(shù)據(jù)源進(jìn)行正則匹配，匹配到的就是搜索到的。
過濾函數(shù)我是這么寫的：
//searchKey是輸入的數(shù)據(jù)
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);
但是實(shí)際運(yùn)行時(shí)，發(fā)現(xiàn)數(shù)據(jù)源中的數(shù)據(jù)，有的可以匹配到有的匹配不到。當(dāng)時(shí)就納悶了，這有什么問題嗎？最后幾經(jīng)查找答案，原來是正則表達(dá)式的全局匹配有個(gè)坑：正則表達(dá)式中有一個(gè)lastIndex的屬性，這個(gè)屬性表示上一次匹配文本結(jié)果之后的第一個(gè)字符的位置。他在下一次查找的時(shí)候，會(huì)從lastIndex往后繼續(xù)查找，這就會(huì)導(dǎo)致一下個(gè)匹配返回false。
那么如何解決呢？
因?yàn)?code>lastIndex屬性是可讀可寫的，所以我這里的解決辦法是每次test方法之后將將lastIndex置為零，這樣每次匹配都將會(huì)從最開始進(jìn)行查找。這樣就會(huì)避免這個(gè)問題了哦！
let _flag = regex.test(i.value); regex.lastIndex = 0;
到此這篇關(guān)于jJavaScript中toFixed()和正則表達(dá)式的坑的文章就介紹到這了,更多相關(guān)toFixed()和正則表達(dá)式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
- 盤點(diǎn)javascript 正則表達(dá)式中 中括號(hào)的【坑】
- JS使用tofixed與round處理數(shù)據(jù)四舍五入的區(qū)別
- JS處理數(shù)據(jù)四舍五入(tofixed與round的區(qū)別詳解)
- javascript中toFixed()四舍五入使用方法詳解
- js正則表達(dá)式簡(jiǎn)單校驗(yàn)方法
- js用正則表達(dá)式篩選年月日的實(shí)例方法
- JS中toFixed()方法四舍五入的精度問題詳解
- JavaScript 正則表達(dá)式詳解
- jmeter實(shí)現(xiàn)接口關(guān)聯(lián)的兩種方式(正則表達(dá)式提取器和json提取器)
- 在nest.js中通過正則表達(dá)式正確設(shè)置驗(yàn)證的方法
相關(guān)文章
JS去除字符串最后的逗號(hào)實(shí)例分析【四種方法】
這篇文章主要介紹了JS去除字符串最后的逗號(hào),結(jié)合實(shí)例形式分析了四種字符串遍歷、截取的操作方法,需要的朋友可以參考下2019-06-06
JS實(shí)現(xiàn)標(biāo)簽頁(yè)效果(配合css)
實(shí)現(xiàn)的效果是當(dāng)鼠標(biāo)移到某一個(gè)標(biāo)簽的時(shí)候，在下面的內(nèi)容區(qū)顯示對(duì)應(yīng)的內(nèi)容，并且相應(yīng)標(biāo)簽的顏色需要改變,這樣的效果是CSS和JS配合實(shí)現(xiàn)的,下面我們就來看看具體代碼2013-04-04
當(dāng)一個(gè)元素上的事件被觸發(fā)的時(shí)候，比如說鼠標(biāo)點(diǎn)擊了一個(gè)按鈕，同樣的事件將會(huì)在那個(gè)元素的所有祖先元素中被觸發(fā)2013-01-01
下面小編就為大家?guī)硪黄猨s enter鍵激發(fā)事件實(shí)例代碼。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-08-08
JavaScript實(shí)現(xiàn)簡(jiǎn)單的樹形菜單效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡(jiǎn)單的樹形菜單效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
這篇文章主要介紹了微信小程序下拉菜單效果的實(shí)例代碼，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-05-05
如何用JavaScript動(dòng)態(tài)呼叫函數(shù)(兩種方式)
下面介紹一下動(dòng)態(tài)呼叫函數(shù)目前應(yīng)該有下面兩種方式，它們之間的使用及對(duì)比，感興趣的朋友可以研究下，希望可以幫助到你2013-05-05
基于JavaScript實(shí)現(xiàn)線性漸變的高斯模糊效果
這篇文章主要為大家詳細(xì)介紹了高斯模糊算法以及線性漸變的高斯模糊算法的原理,并通過一個(gè)小demo展示了如何實(shí)現(xiàn)y方向上線性漸變的高斯模糊效果,需要的可以了解下2024-01-01
JS中的6種打斷點(diǎn)的方式實(shí)例總結(jié)
斷點(diǎn)調(diào)試是啥?難不難? 斷點(diǎn)調(diào)試其實(shí)并不是多么復(fù)雜的一件事,簡(jiǎn)單的理解無外呼就是打開瀏覽器,打開sources找到j(luò)s文件,在行號(hào)上點(diǎn)一下罷了,下面這篇文章主要給大家介紹了關(guān)于JS中6種打斷點(diǎn)方式的相關(guān)資料,需要的朋友可以參考下2022-04-04
js控制臺(tái)報(bào)錯(cuò)Uncaught TypeError: Cannot read p
本文主要介紹了js控制臺(tái)報(bào)錯(cuò)Uncaught TypeError: Cannot read properties of undefined (reading ‘a(chǎn)ppendChild‘)的解決，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07