解决JavaScript中的大数字问题（json-bigint）

最新推荐文章于 2024-07-24 13:53:49 发布
最新推荐文章于 2024-07-24 13:53:49 发布
阅读量5.6k 收藏 5
点赞数 4
文章标签： vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_57757602/article/details/118832650
版权
今天遇到一个js中因为数字过大而导致数据传输时精度丢失，导致疯狂报错的问题（无奈），检查了好几遍代码后确定并没有写错代码，然后又回来找原因，这也好像是我第一次遇到大数字传输的问题。。。我的需求就只是通过一个很长的id值，然后发起请求并从后端获取相应的数据，最后发现是id值过长导致的报错，下面是我对这个问题的一些思考和理解JavaScript可以很精准的来表示-2^53到2^53之间的数（不包含端点），ES6中提供了两个方法Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_I
摘要由CSDN通过智能技术生成

今天遇到一个js中因为数字过大而导致数据传输时精度丢失，导致疯狂报错的问题（无奈），检查了好几遍代码后确定并没有写错代码，然后又回来找原因，这也好像是我第一次遇到大数字传输的问题。。。我的需求就只是通过一个很长的id值，然后发起请求并从后端获取相应的数据，最后发现是id值过长导致的报错，下面是我对这个问题的一些思考和理解

JavaScript可以很精准的来表示-2^53到2^53之间的数（不包含端点），ES6中提供了两个方法Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER来表示最高最低两个值，输出如下👇

 Number.MIN_SAFE_INTEGER的值，👇

 Number.MAX_SAFE_INTEGER的值，👇

 在实际运用中，只要数值超过了规定的上限或者是下线，数值就有可能（概率还挺大的！！）失去精度，比如说👇将JavaScript对象转换成json字符时发生错误

let obj = {
        id:90071992547410057,
        name:"Tom",
        ag
最低0.47元/天 解锁文章
黄焖鸡又涨价了
关注
  • 4
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
json-bigint处理大数字问题
weixin_44771007的博客
06-09 5975
js里面的整数有安全范围，即最大能显示的范围，超过了这个范围可能会精度丢失 Number.MAX_SAFE_INTEGER //值为9007199254740991 json-bigint：可以像JSON.parse一样方便转换 用法： //导入 import JSONbig from 'json-bigint' //可以通过axios的transformResponse方法，这个方法的作用是在传递给then/catch前，允许修改响应数据 //axios在这里默认把响应体从json字符串转.
json-bigint插件没效果
redfore的博客
07-18 498
json-bigint插件没效果
使用json-bigint解析和序列化大整数的优雅解决方案
gitblog_00053的博客
05-17 520
使用json-bigint解析和序列化大整数的优雅解决方案 项目地址:https://gitcode.com/sidorares/json-bigint 在JavaScript中处理大整数时，你可能会遇到精度丢失的问题，因为标准的JSON解析器在解析大于JavaScript安全整数范围（Number.MAX_SAFE_INTEGER）的数值时会失真。为了解决这个问题，我们向您推荐一个名为json-...
利用json-bigint处理大数字问题
m0_60855156的博客
11-25 1439
json-bigint是一个第三方包，它可以帮我们很好的处理这个问题 第一步就是把它安装到你的项目中 npm i json-bigint 引入你的项目中 import JSONBig from 'json-bigint' 下面是使用它的一个简单示例 const jsonStr = '{ "art_id": 1245953273786007552 }' console.log(JSON.parse(jsonStr)) // 1245953273786007600 // JSON.str..
超大整型数字处理json-bigint的应用
jyn15159的博客
09-30 2066
超大整型数字处理json-bigint 1. json-bigint的作用和原理 json-bigint的作用: 项目中如果使用一些超出javascript语言限制的超大整型数字信息，该数字会变形为其他信息，为了避免产生问题，可以通过json-bigint做转换，使得超大整型数字可以正常使用，这就是json-bigint的作用。 情景： 后端服务器返回的文章id已经大大超过了js语言可以表达的最大整型范畴，因而直接使用的时候会发生变型: 例如： ​ 本质id为：1215831343376629760
解决后端返回数据中的大数字问题(使用第三方包json-bigint ）
zep
07-17 1873
JavaScript 能够准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算。 Math.pow(2, 53) // 9007199254740992 9007199254740992 // 9007199254740992 9007199254740993 // 9007199254740992 Math.pow(2, 53) === Math.pow(2, 53) + 1 // true
json-bigint处理大整数问题（详解）
热门推荐
weixin_50636536的博客
01-28 1万+
现象 通过ajax请求回来的数据在response和preview两种状态显示的id是不同的。 如图： 原因 response中的看到的数据格式其实是字符串（ajax请求回来的数据本质上是字符串格式），preview其实是用了JSON.Parse(字符串) 给我们做美化（格式化），这个转换过程中，一般不会出问题，但是，如涉及大数(一个很大的整数，超过了javascript最大的处理能力)，就会产生转换精度丢失------- 就产生了错误了。 JavaScript 能够准确表示的整数范.
前端 json-bigint 的问题分析
悠悠小世界
06-06 948
json-bigint中的对象创建问题 - Object.create(null)
利用json-bigint处理后台数据大数字问题
WikY
12-21 1393
json-bigint GitHub网址：https://github.com/sidorares/json-bigint 当我们在写项目的时候调用后台接口的地址需要接收一个id值例如：（id：9223372036854776000） JavaScript 能够准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算 浏览器会默认解析得到数值与原数值不匹配导致404问题 解决这个问题我们使用第三方插件
js代码-BigInt使用方法示例。
07-16
为了解决这个问题，ES2020引入了一种新的内置类型——BigInt。BigInt允许我们处理任意大小的整数，这对于加密、计算、科学计算等领域非常有用。本文将深入探讨JavaScript中的BigInt使用方法，以及如何在实际项目中...
leetcode-javascript-version:LeetCode的Javascript解决方案
03-29
通过这个项目，你可以深入理解JavaScript在解决实际问题中的运用，提高你的编程思维和解决问题的能力。同时，它也是面试前的重要准备资料，因为LeetCode上的问题经常出现在各大公司的技术面试中。不断实践和学习这些...
关于JSON以及JSON在PHP中的应用技巧
10-26
默认情况下，JSON解码会将所有数字转为浮点数，但使用`JSON_BIGINT_AS_STRING`可以保留大整数的原始字符串形式。 8. **自定义编码和解码**： 如果需要对特定类型的变量进行自定义编码或解码，可以使用`json_...
在web开发中更加富有效率的使用JSON
08-08
在Web开发中，JSON（JavaScript Object Notation）已经成为数据交换的主要格式，因为它具有简洁、易于阅读和编写的特点。本文将深入探讨如何更有效地利用JSON，提高Web应用的效率。 首先，理解JSON的基本结构至关...
详解Vue中nextTick的原理与作用
fengjing81的专栏
07-24 818
Vue中的nextTick是一个非常重要的API，它允许开发者延迟回调函数的执行直到下次DOM更新循环之后。这一机制在Vue开发中非常有用，特别是在处理DOM更新和异步操作时。下面将详细解释nextTick的原理与作用。
vue实现电子签名、图片合成、及预览功能
weixin_58572700的博客
07-23 1113
本文介绍了电子签名、图片合成、及预览功能
Vue系列面试题
qq_44186810的博客
07-23 995
Vue2中采用Object.defineProperty来实现数据响应式，Object.definePropery虽然可以监听到数组的变化，但是由于在性能和体验的性价比上考虑，Vue2放弃了这个特性。1）v-for优先于v-if被解析，从源码中发现，先处理静态节点，在处理once，在处理for，在处理if，代码显示for的优先级比if高，断点调试也证实for优先于if。v-if：是惰性渲染机制，在属性初始为false时，组件就不会被渲染，直到条件为true，并且切换条件时会触发销毁/挂载组件。
Vue 状态管理 & Vue CLI
最新发布
yolo
07-24 906
1、状态管理 2、集中状态管理 2.1 Vuex 2.1.1 Vuex核心概念 2.1.2 Vuex Store实例 2.1.3 Vuex Getter 2.1.4 Vuex Mutation 2.1.4 Vuex Actions 2.1.4 Vuex Module 2.2 Pinia 2.2.1功能增强 3、Vuex 实现原理 4、Pinia 实现原理 5、CLI 5.1 实现
json-bigint使用
06-13
在 JavaScript 中，处理大整数时，通常会出现精度问题。这时可以使用 `json-bigint` 库来解决这个问题。`json-bigint` 库是一个可以处理大整数的 JSON 解析器和字符串序列化器，可以支持任意长度的整数，并且提供了一些方便的方法来处理大整数。 下面是一个简单的使用 `json-bigint` 库的示例： ```javascript const JSONbig = require('json-bigint'); // 将 JSON 字符串解析为 JavaScript 对象 const jsonString = '{"id": 1234567890123456789}'; const jsonObj = JSONbig.parse(jsonString); console.log(typeof jsonObj.id); // 输出：object // 将 JavaScript 对象序列化为 JSON 字符串 const jsonString2 = JSONbig.stringify(jsonObj); console.log(jsonString2); // 输出：{"id":1234567890123456789} ``` 在上述代码中，我们首先引入了 `json-bigint` 库，然后通过 `JSONbig.parse()` 方法将 JSON 字符串解析为 JavaScript 对象。由于该对象的 `id` 属性是一个大整数，我们在使用 `typeof` 操作符检查其类型时，得到的是 `object`。接着，我们使用 `JSONbig.stringify()` 方法将 JavaScript 对象序列化为 JSON 字符串，并输出结果。 需要注意的是，`json-bigint` 库的使用方式和原生的 `JSON` 对象基本相同，只是在解析和序列化时需要使用 `JSONbig.parse()` 和 `JSONbig.stringify()` 方法。还有一点需要注意的是，使用 `json-bigint` 库时，需要确保被解析的 JSON 字符串中的大整数没有被转换成科学计数法形式。如果被转换成科学计数法形式，可能会导致 `JSONbig.parse()` 方法解析失败。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值