JS 實現貨幣格式化
阿新 • • 發佈:2020-12-22
今天被問到貨幣格式化的問題
思路很清晰,但是讓我寫的時候,問題來了,確實是知易行難
首先肯定得有 錢
,假設為 123456.78
我們需要將他格式化為 ¥123,456.78
拋開小數位不管,我們需要獲取整數位的數字字串
預設應該是以千分位加一個,
我的思路是將整數位的字串倒著擷取,每3位數一組
那麼問題來了,js擷取字串的方法有那些?
slice
、substring
、substr
用得最多的大概是slice
吧?!一提起slice
,腦子裡閃過的又有splice
、split
slice、substring、substr
slice
str.slice(beginIndex[, endIndex])
引數
beginIndex
從該索引(以 0 為基數)處開始提取原字串中的字元。如果值為負數,會被當做 strLength + beginIndex 看待,這裡的strLength 是字串的長度(例如, 如果 beginIndex 是 -3 則看作是:strLength - 3)endIndex
可選。在該索引(以 0 為基數)處結束提取字串。如果省略該引數,slice() 會一直提取到字串末尾。如果該引數為負數,則被看作是 strLength + endIndex,這裡的 strLength 就是字串的長度(例如,如果 endIndex 是 -3,則是, strLength - 3)。
返回值
返回一個從原字串中提取出來的新字串
substring
str.substring(indexStart[, indexEnd])
引數
indexStart
需要擷取的第一個字元的索引,該索引位置的字元作為返回的字串的首字母。indexEnd
可選。一個 0 到字串長度之間的整數,以該數字為索引的字元不包含在擷取的字串內。
返回值
包含給定字串的指定部分的新字串。
substr
str.substr(start[, length])
引數
start
開始提取字元的位置。如果為負值,則被看作 strLength + start,其中 strLength 為字串的長度(例如,如果 start 為 -3,則被看作 strLength + (-3))。length
可選。提取的字元數。
區別
- slice,substring,substr 都是用來擷取字串或陣列的,然而陣列只能使用slice,這三者如果不傳引數,則都返回全部內容;
- 引數為正數時,只有substring會自動調換順序,slice在第一引數大於第二引數時會無效返回空,而substr無所謂,除非給定的第一引數超出了源資料長度才會返回空;
- 引數為負數時,只有substring會永遠無效,即不要給substring使用負值!slice可認為從尾部倒數,或者直接用源資料長度加上這個負值換算為正數,然後結論依然遵循第2條所述;而substr,則只適用第一引數為負數,換算方法同slice,其第二引數代表擷取的個數,是不能為負數的;
- 據MDN所提示 (連結: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/substr) ,“ECMAscript 沒有substr方法進行標準化,因此不推薦使用它”。
用slice實現
本來打算使用substr
的,既然不推薦,那麼還是使用slice
吧
function formatMoney(money, symbol) {
symbol = symbol || '¥' // 預設是RMB
let str = money.toFixed(2) // 只取2位小數
let l = str.split('.')[0] // 獲取整數位
let r = str.split('.')[1] // 獲取小數位
let arr = [] // 用於儲存結果
let len =Math.ceil(l.length / 3) // 3位數一個 `,`
for (let i = 0 ; i < len; i ++) {
arr.unshift(l.slice(-3*(i + 1), -3*i || undefined)) // 如果傳(-3,0)獲取不到引數,將0換成undefined相當於沒傳
if (i !== length - 1) { // 最後一次擷取不加 `,`了
arr.unshift(',')
}
}
return symbol + arr.join('') + '.' + r
}
這是我覺得容易理解的方法之一