我們是袋鼠雲數棧 UED 團隊,致力於打造優秀的一站式數據中台產品。我們始終保持工匠精神,探索前端道路,為社區積累並傳播經驗價值。。 本文作者:奇銘(掘金) 需求背景 前段時間,離線計算產品接到改造數據同步表單的需求。 一方面,數據同步模塊的代碼可讀性和可維護性比較差,相對應的,在數據同步模塊開發新 ...
我們日常開發中,時常會碰到數值格式化操作的場景,今天了不起就為大家分享一款相對比較全面的數值格式化的JS庫:Numeral.js
Numeral.js
Numeral.js 是一個用來對數值進行操作和格式化的 JS 庫。可將數字格式化為貨幣、百分比、時間,甚至是序數詞的縮寫(比如1st,100th)。
安裝
下載到本地引入
<script src="numeral.min.js"></script>
或使用CDN路徑
<script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
當然,Node.js 環境還可以使用npm包。
npm install numeral
使用
在需要用到的地方聲明即可
var numeral = require('numeral');
這相當於創建一個numeral實例
。接著就可以拿著這個實例使用了。
- 數字格式化
numeral(1000).format('0,0');
// '1,000'
numeral(1234).format('0,0');
// 1,234 不帶小數
numeral(1234).format('0,0.00');
// 1,234.00 保留兩位小數
numeral(1).format('0o');
// 1st
numeral(2).format('0o');
// 2nd
numeral(10).format('0o');
// 10th
表中的格式完全夠日常開發所用了。
- 貨幣格式化
numeral(1000.234).format('$0,0.00');
// $1,000.23
ps:自動千分位分隔,四捨五入取值。
- 位元組格式化
ps:位元組格式化主要用在存儲統計上。
- 百分比格式化
遵循四捨五入規則,小數轉換為百分比,同時避免了浮點運算精度的問題。
numeral(0.144252).format('0.00%');
// 14.43% 小數點四捨五入
ps:如果直接將0.144252乘以100,會得到什麼結果呢?大家不妨試試!
- 時間格式化
numeral(238).format('00:00:00');
// 0:03:58
- 指數格式化
numeral(1123456789).format('0.0e+0');// 1.1e+9
numeral(0.000134255).format('0.0e+0');// 1.3e-4
這也就是我們的科學計數法表示方式。
- 計算相關
哈哈,加、減、乘、除來一套!
var number = numeral(1000);
var result = number.add(100);
// 1100
其他
除了上面的方法之外,numeral.js 中還包括設值、差異求值、複製克隆、本地化、自定義格式等方法和功能。歡迎大家查閱下發地址進一步瞭解。
Github地址:https://github.com/adamwdraper/Numeral-js
官方網站:
http://numeraljs.com