项目中JavaScript 中最大的安全整数
栏目: JavaScript · 发布时间: 5年前
内容简介:MAX_SAFE_INTEGER 是一个值为 9007199254740991的常量。因为Javascript的数字存储使用了IEEE 754中规定的双精度浮点数数据类型,而这一数据类型能够安全存储 -(253 - 1) 到 253 - 1 之间的数值(包含边界值)。---在代码中输出比MAX_SAFE_INTEGER大的Number值在代码中比较超出安全存储的数值,可能会存在下列情况
什么是最大安全整数?
MAX_SAFE_INTEGER 是一个值为 9007199254740991的常量。因为Javascript的数字存储使用了IEEE 754中规定的双精度浮点数数据类型,而这一数据类型能够安全存储 -(253 - 1) 到 253 - 1 之间的数值(包含边界值)。--- MDN WEB DOCS
在项目会导致什么错误?
在代码中输出比MAX_SAFE_INTEGER大的Number值
console.log(9007199254740999) // 9007199254741000 console.log(9007199254740993) // 9007199254740992
在代码中比较超出安全存储的数值,可能会存在下列情况
9007199254740993 === 9007199254740992 // true
实际项目中碰到的问题
在进行vue 项目开发的时候,通过axios进行前后端数据交互
后端在定义某些数据时将数据的ID 设置为比MAX_SAFE_INTEGER大的int类型
而我取到后也没有注意到这一情况,在修改某一条数据时,是通过传回数据ID进行数据定位的。
然后问题就出现了。。。。
数据死活修改不了,后端返回无这条数据,调试了半天,
然后通过对比preview 和 response 中的数据发现了两者数据不一致
如何解决?
第一个想法是在axios的拦截器中做处理,将数字类型转换为字符串
9007199254740993 => '9007199254740993'
但经过尝试后发现axios拦截器中的数据本身就是错误了。
然后就用了原生的fetch 做处理
export function getData(data) { const promise = new Promise(function (resolve, reject) { const headers = new Headers() headers.append('Content-Type', 'application/json') const config = { method: 'POST', headers, body: JSON.stringify(data) } fetch('api/url', config).then(res => res.text()).then(text => { function numberToString (match) { return `:"${match.substring(1, match.length - 1)}",` } const responseJson = JSON.parse(text.replace(/:\d{15,100},/g, numberToString)) resolve(responseJson) }) }) return promise }
但问题是这个只解决了一个api 的问题,然后每个都这样写,太烦了。
而且fetch 并没有axios中的拦截器,不能统一处理异常
所有便想要自己封装一个fetch通过模仿axios 那样设置拦截器之类的功能。。。。。。
然后就没有然后了,感觉封装一个目前需要的fetch会花个半天到一天的时间。
而且又快下班了,所以就去看axios文档了。
发现axios文档中已经有这样一个回调函数,能解决这个问题
// `transformResponse` allows changes to the response data to be made before // it is passed to then/catch transformResponse: [function (data) { // Do whatever you want to transform the data return data; }],
这个不看文档的坏习惯,浪费了大半天时间
最后代码
const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, // api 的 base_url timeout: 5*1000, // request timeout transformResponse: [function (data) { function numberToString (match) { return `:"${match.substring(1, match.length - 1)}",` } if (isJSON(data)) { const responseJson = JSON.parse(data.replace(/:\d{15,100},/g, numberToString)) return responseJson } else { return data } }] })
总结
第一,我这个数据是json类型的的所以在取到原始数据就是字符串,其实是对字符串进行处理
第二,最后的方案不是最优的,应为这个会处理每一条数据,不管那条数据中有没有超出范围的数字
第三,能想到的比较好的方案是和后端对接时问清楚那些是超出的,然后将这两种情况区分开来,再使用不同的axios 封装
以上所述就是小编给大家介绍的《项目中JavaScript 中最大的安全整数》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- 989-数组形式的整数加法
- leetcode刷题-----7. 整数反转
- Python 2.7 源码 - 整数对象
- c# – 为负整数返回零
- 深入理解动态规划算法:凑整数
- 剑指offer 16——数值的整数次方
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
The Starfish and the Spider
Ori Brafman、Rod A. Beckstrom / Portfolio Hardcover / 2006-10-05 / USD 24.95
Understanding the amazing force that links some of today's most successful companies If you cut off a spider's leg, it's crippled; if you cut off its head, it dies. But if you cut off a st......一起来看看 《The Starfish and the Spider》 这本书的介绍吧!