js数据处理时遇到的坑

项目中多次遇到浮点数计算问题,众所周知,js在计算浮点数时候,结果可能会不准确,因为浮点数的小数部分无法用二进制很精准的转换出来,而以近似值来进行运算的话,就存在精度的问题
因为项目中规定保留两位小数,但接口返回数据存在几种情况,数字型整数、数字型小数、字符串型整数、字符串型小数,导致考虑情况需要全面。
初版,通过*100将两位小数转化为整数处理

let arr = ['10000','3621.27','10000','10000']
let result = arr.reduce(function(prev,cur){
    return prev + parseFloat(cur)
},0)
console.log(result) // 33621.270000000004

修改后

let arr = ['10000','3621.27','10000','10000']
let result = arr.reduce(function(prev,cur){
    return prev + parseFloat(cur)*100
},0)
console.log(result/100) // 33621.27

修改前

let a = "434.91"
let b = 465.51
console.log(b - a) // 30.599999999999966

修改后

let a = 434.91
let b = 465.51
console.log((100*b - 100*a)/100) //30.6

往往事情比想象复杂,第一步乘就出现了问题

289.9-259.3 // 30.599999999999966
289.9*100-259.3*100  // 3059.9999999999964
289.9*100 //28989.999999999996

更正版本

let a = 289.9
let b = 259.3
let temp = parseFloat(a).toFixed(2).replace(".","") - parseFloat(b).toFixed(2).replace(".","")
let result = temp.toString().slice(0,-2) + '.' + temp.toString().slice(-2)
console.log(result)
function dealDigit(number) {
	let result = ""
    if(typeof number == "string") {
        number = parseFloat(value.replace(/,/g, '')).toFixed(2)
    } else if(typeof number == "number") {
        number = number.toFixed(2);
    } else {
        return ""
    }
	if (number.indexOf(".") == -1) {
	    result = number.replace(/\d{1,3}(?=(\d{3})+$)/g, function(s) {
	        return s + ',';
	    });
	} else {
	    result = number.replace(/(\d)(?=(\d{3})+\.)/g, function(s) {
	        return s + ',';
	    });
	}
    return result
}
dealDigit(123456789.123)
### UniApp 小程序开发常见问题及解决方法 #### 1. 编译报错:`Module not found` 当项目中引入某些模块,可能会遇到 `Module not found` 的错误提示。这通常是由于路径配置不正确或依赖包未安装所致。 ```bash npm install --save 模块名称 ``` 确保所有依赖项都已正确安装,并检查 `import` 或 `require` 路径是否准确无误[^1]。 #### 2. 页面跳转失败 页面间导航出现问题可能是路由设置不当引起的。应确认 `pages.json` 文件中的页面路径与实际文件位置相匹配。对于动态参数传递,则需注意 URL 参数格式化处理: ```javascript // 正确的方式 this.$router.push({ path: '/path/to/page', query: { id: 'someId' } }); ``` 此外,在目标页面接收参数要使用 `$route.query.id` 来获取传入的数据[^2]。 #### 3. 组件样式冲突 如果发现自定义组件内的 CSS 样式影响到了其他部分,可能是因为全局样式的优先级较高或是 scoped 属性缺失造成的。建议给每个独立组件加上 `<style scoped>` 标签以限定作用范围;也可以尝试调整 `.vue` 文件里的 style 部分加载顺序来解决问题[^3]。 #### 4. 数据请求超 网络接口调用常会面临连接不稳定的情况,这应该考虑增加重试机制并合理设定超长。利用 uni.request API 提供的相关选项优化 HTTP 请求逻辑: ```javascript uni.request({ url: 'https://example.com/api/data', //仅为示例网址,请替换为真实地址 method: 'GET', timeout: 8000, // 设置合理的超间(ms) success(res) { console.log('success:', res); }, fail(err) { console.error('fail:', err); // 可在此处加入重新发起请求或其他异常处理措施 } }); ``` #### 5. 性能瓶颈 随着应用复杂度上升,性能损耗成为不可避免的话题。针对此现象可以从以下几个方面入手改善用户体验: - 减少不必要的 DOM 操作次数; - 对图片资源做懒加载处理; - 使用缓存技术减少重复计算量; - 合理规划业务流程降低服务器压力等。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值