关于json-bigint处理大数字问题_Javascript

json-bigint处理大数字问题

js里面的整数有安全范围，即最大能显示的范围，超过了这个范围可能会精度丢失

number.max_safe_integer  //值为9007199254740991

json-bigint：可以像json.parse一样方便转换

用法：

//导入
import jsonbig from 'json-bigint'

//可以通过axios的transformresponse方法，这个方法的作用是在传递给then/catch前，允许修改响应数据

//axios在这里默认把响应体从json字符串转成了js对象
axios.defaults.transformresponse = [function (data) {
console.log(data)//这里的data是字符串，在这个字符串的是没有丢失精度的，所以需要在这里先把精度调好

	try {
	//作用1：把json字符串转为js对象
	//作用2：把里面的大数字做安全处理
	 return jsonbig.parse(data)
	}catch(){
	return data;
	}
	//return data;
}]

//如果不写这个方法，返回的数据是自动就转为json对象的了，如果写了，就要自己转为对象，即return json.parse(data)

注意：

alert会自动调用了tostring()方法

只要经过json-bigint转换后的id，直接tostring()，就能得到真实的id

超大整型数字处理json-bigint的应用

1.json-bigint的作用和原理

json-bigint的作用：

项目中如果使用一些超出javascript语言限制的超大整型数字信息，该数字会变形为其他信息，为了避免产生问题，可以通过json-bigint做转换，使得超大整型数字可以正常使用，这就是json-bigint的作用。

情景：

后端服务器返回的文章id已经大大超过了js语言可以表达的最大整型范畴，因而直接使用的时候会发生变型:

例如：

本质id为：1215831343376629760
变型后为：1215831343376629800

console.log(1215831343376629760)    // 输出为：1215831343376629800

javascript中可以表达的最大整型可以通过如下代码获得：

console.log( number.max_safe_integer )
// 输出：9007199254740991

json-bigint的原理：

json-bigint会把超大整型的数字信息，拆分为小段信息存储到数组的各个元素中，待使用的时候再拼接到一起变为字符串。

github网站相关介绍： https://github.com/sidorares/json-bigint

json-bigint使用示例：

var jsonbig = require('json-bigint');  // 需要先安装 npm i json-bigint
var str = '{ "value" : 9223372036854775807, "v2": 123 }';

var obj = jsonbig.parse(str) // 字符串--->对象
console.log(obj.value) // 9223372036854775807(正确)

var obj2 = json.parse(str) // 字符串--->对象
console.log(obj2.value) // 9223372036854776000(错误)

结论：

json-bigint会对一个包含超大整型信息的“字符串”做转换处理变为对象，这个对象可以获得正确的超大整型数字信息。

2.超大整型数字的具体处理

示例：

应用超大整型数字处理技术对接口返回的文章id信息做处理，使得可以被正确接收和使用。

服务器给客户端返回数据的第一手处理者是 “转换器( transformresponse )”，转换器处理完毕再交给响应拦截器使用，故要对超大整型数字信息做处理，下手点是"转换器"(响应拦截器获得数据已经是变形后的内容了)

本质上：服务器返回信息的类型是“字符串”，要经过转换器做jsonbig.parse()转化处理，所以响应拦截器接收到的是对象。

步骤：

1.安装工具依赖包：

npm i json-bigint

2.在src/utils/ax.js中引入json-bigint模块，对服务器返回的信息做处理，具体通过axios的 “数据转换” 机制实现：

import jsonbig from 'json-bigint'

// 服务器端返回，数据转换器，应用
axios.defaults.transformresponse = [function (data) {
  // data的返回形式有两种
  // 1. 实体字符串
  // 2. 空字符串(不能转的)
  // jsonbig.parse针对超大整型进行处理，其他信息不给处理
  if (data) {
    return jsonbig.parse(data)
  }
  return data
}]

注意：

1.上述数据转换一定要设置else，以便对空字符串做处理，因为服务器有时候会返回空字符串信息。

2. json-bigint处理的是字符串类型的信息，超大整型数字给处理，普通信息不给与处理。