js金額千分位的6種實(shí)現(xiàn)方法實(shí)例
方法一 數(shù)組分割法
這種方法也是自己最容易想到的一種方式,通過將數(shù)組以點(diǎn)分割,然后按照3位一體進(jìn)行字符的拼接
function format_with_array(number) { // 轉(zhuǎn)為字符串,并按照.拆分 const arr = (number + '').split('.'); // 整數(shù)部分再拆分 const int = arr[0].split(''); // 小數(shù)部分 const fraction = arr[1] || ''; // 返回的變量 let r = ''; int.reverse().forEach(function (v, i) { // 非第一位并且是位值是3的倍數(shù),添加“,” if (i !== 0 && i % 3 === 0) { r = v + ',' + r; } else { // 正常添加字符(這是好寫法) r = v + r; } }); // 整數(shù)部分和小數(shù)部分拼接 return r + (!!fraction ? '.' + fraction : ''); } // 測試用例 console.log(format_with_array(1234567893.99));
方法二 字符截取法
字符截取法,具體看看注釋
function format_with_substring(number) { // 數(shù)字轉(zhuǎn)為字符串,并按照 .分割 let arr = (number + '').split('.'); let int = arr[0] + ''; let fraction = arr[1] || ''; // 多余的位數(shù) let f = int.length % 3; // 獲取多余的位數(shù),f可能是0, 即r可能是空字符串 let r = int.substring(0, f); // 每三位添加','金額對應(yīng)的字符 for (let i = 0; i < Math.floor(int.length / 3); i++) { r += ',' + int.substring(f + i * 3, f + (i + 1) * 3); } // 多余的位數(shù),上面 if (f === 0) { r = r.substring(1); } // 調(diào)整部分和小數(shù)部分拼接 return r + (!!fraction ? '.' + fraction : ''); } console.log(format_with_substring(12112123313.78));
方法三 求模法
這種方法按照 用1000求模取末尾3位,然后用除法判斷是否還有剩余位數(shù)的方法去做的,這種方法性能也是最好的,推薦大家使用!
function format_with_mod(number) { let n = number; let r = ''; let temp = ''; do { // 求模的值, 用于獲取高三位,這里可能有小數(shù) mod = n % 1000; // 值是不是大于1,是繼續(xù)的條件 n = n / 1000; // 高三位 temp = ~~mod; // 1.填充: n > 1 循環(huán)未結(jié)束, 就要填充為比如 1 => 001 // 不然temp = ~~mod的時候, 1 001, 就會變成 "11" // 2.拼接“,” r = (n >= 1 ? `${temp}`.padStart(3, '0') : temp) + (!!r ? ',' + r : ''); } while (n >= 1); const strNumber = number + ''; let index = strNumber.indexOf('.'); // 拼接小數(shù)部分 if (index >= 0) { r += strNumber.substring(index); } return r; } console.log(format_with_mod(1234567893.99));
方法四 正則表達(dá)式(先行斷言)
說這種方法前,我們來了解下什么是先行斷言吧!看例子。
有以下字符串: 我愛你 我愛 愛 愛你
如果要取出愛字,要求這個愛字后面有你,這個時候就要這么寫,這就是 先行斷言:
'我愛你 我愛 愛 愛你'.match(/愛(?=你)/g) // ["愛", "愛"]
如果要求愛字后面沒有你,那自然也有先行否定斷言:
'我愛你 我愛 愛 愛你'.match(/愛(?!你)/g) // ["愛", "愛"] ,因為匹配相同...
這個時候,如果要求愛字后面有你,前面還要有我,那就要用到后行斷言了,如下:
'我愛你 我愛 愛 愛你'.match(/(?<=我)愛(?=你)/g) // ["愛"]
最后,如果要求愛字前面沒有我,后面也沒有我,那就要用到先行否定斷言和**后行否定斷言,**如下:
'我愛你 我愛 愛 愛你'.match(/(?<!我)愛(?!你)/g) // ["愛"]
所以正則表達(dá)式還是比較靈活的,接下來,讓我們一起來瞅瞅正則表達(dá)式是如何來玩千分位的,上代碼。
function format_with_regex(number) { return !(number + '').includes('.') ? // 就是說1-3位后面一定要匹配3位 (number + '').replace(/\d{1,3}(?=(\d{3})+$)/g, (match) => { return match + ','; }) : (number + '').replace(/\d{1,3}(?=(\d{3})+(\.))/g, (match) => { return match + ','; }); } console.log(format_with_regex(1243250.99));
第四行 d{1,3} 數(shù)字出現(xiàn)1-3次,后面緊緊跟隨著3個數(shù)字,如1243250,首先243前面有1,符合條件所以是1,243;后面250前面是243符合條件,所以是1,243,250
方法五 通過Intl.NumberFormat
這種方法是我在往上無意種發(fā)現(xiàn)的,使用這種方式會導(dǎo)致函數(shù)不斷的初始化,會導(dǎo)致性能上的問題。
function format_with_Intl( number, minimumFractionDigits, maximumFractionDigits ) { minimumFractionDigits = minimumFractionDigits || 2; minimumFractionDigits = maximumFractionDigits || 2; maximumFractionDigits = Math.max( minimumFractionDigits, maximumFractionDigits ); return new Intl.NumberFormat('en-us', { maximumFractionDigits: maximumFractionDigits || 2, minimumFractionDigits: minimumFractionDigits || 2, }).format(number); } console.log(format_with_Intl(123456789.98));
方法六 number.toLocaleString方式
這個是通過js帶的api來的,和方法五一樣會有性能上的問題。
function format_with_toLocalString( number, minimumFractionDigits, maximumFractionDigits ) { minimumFractionDigits = minimumFractionDigits || 2; minimumFractionDigits = maximumFractionDigits || 2; maximumFractionDigits = Math.max( minimumFractionDigits, maximumFractionDigits ); return number.toLocaleString('en-us', { maximumFractionDigits: maximumFractionDigits || 2, minimumFractionDigits: minimumFractionDigits || 2, }); } console.log(format_with_toLocalString(123456789.58));
總結(jié)
到此這篇關(guān)于js金額千分位的6種實(shí)現(xiàn)方法的文章就介紹到這了,更多相關(guān)js 金額千分位內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
詳解webpack打包時排除其中一個css、js文件或單獨(dú)打包一個css、js文件(兩種方法)
本文通過兩種方法給大家介紹了webpack打包時排除其中一個css、js文件,或單獨(dú)打包一個css、js文件的方法 ,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下2018-10-10JS實(shí)現(xiàn)區(qū)分中英文并統(tǒng)計字符個數(shù)的方法示例
這篇文章主要介紹了JS實(shí)現(xiàn)區(qū)分中英文并統(tǒng)計字符個數(shù)的方法,涉及JavaScript事件響應(yīng)、正則匹配及數(shù)值運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下2018-06-06D3.js實(shí)現(xiàn)拓?fù)鋱D的示例代碼
本篇文章主要介紹了D3.js實(shí)現(xiàn)拓?fù)鋱D的示例代碼,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-06-06JS實(shí)現(xiàn)可自定義大小,可雙擊關(guān)閉的彈出層效果
這篇文章主要介紹了JS實(shí)現(xiàn)可自定義大小,可雙擊關(guān)閉的彈出層效果,涉及JavaScript定時函數(shù)及頁面元素動態(tài)操作的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10