前端数字与金额处理

367 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第10天,点击查看活动详情

前言:

成功没有捷径但成长有路径

css必备场景。专注积累,每天记录一个知识点,老概念新理解,重点记录一下

每天梳理一个场景,知识点查漏补缺,充实满足。

背景

我做公司内部系统比较多,内部系统会有很多订单相关页面,涉及订单就会有金额的展示,由前端处理数字跟金额是有很大风险的,一旦失误就会直接展示给用户错误的数字,比如收益数字格式化处理正负号时,-1 显示成 +1,这会造成很大的麻烦,这里总结一些有关金额处理经常会出现的问题。

正文

金额靠右展示

这跟财务有关,一般我们的账单金额都是居右的,财务报表数字不但要居右显示,还要两位小数,最好还要有千分号,这样比较直观。

Long类型使用字符串

对js来说是没有长整型的,后端定义的long类型返回的数据,有的是金额,有的是long类型的id,过长的数字前端解析会有数据溢出问题。针对接口返回的数据精度丢失,前端取不到原始值,可以要求后端给字符串。(其他情况的精度丢失怎么处理下次单独写)

单从前端解决

如果后端的Long数据,前端只需要做展示,那么由后端处理字符串后返回比较合适。 但是如果下一步要求前端对这个数字进行计算处理,弊端就是还是会出现溢出问题。可以使用一些插件(比如math.js)进行转换。

总结

更文挑战第一次写文章,为了文章能写的清楚明白,看了不少文章,开始细究每一个点,记录总结转化自己的内容输出,用输出倒逼成长,收获还是蛮大的,希望自己以后能写的越来越好。