聊聊 Go 语言中的 JSON 序列化与 js 前端交互类型失真问题

简介: 在Web开发中,后端与前端的数据交换常使用JSON格式,但JavaScript的数字类型仅能安全处理-2^53到2^53间的整数,超出此范围会导致精度丢失。本文通过Go语言的`encoding/json`包,介绍如何通过将大整数以字符串形式序列化和反序列化,有效解决这一问题,确保前后端数据交换的准确性。

在 Web 开发中,后端与前端之间的数据交换通常通过 JSON 格式进行。

然而,在处理数字,尤其是大整数时,我们可能会遇到精度丢失的问题。这是因为 JavaScript 中的数字类型只能安全地处理一定范围内的整数。其数字类型是基于 64 位双精度浮点数的 Number 类型。这种类型可以安全表示 -2^532^53 之间的整数,超过这个范围的整数将无法精确表示,但是我们后端语言的整数范围是超过的,因此就有可能会遇到精度丢失的问题。

本文将通过 Go 语言的 encoding/json 包,探讨如何通过 JSON 序列化与反序列化来避免数字精度丢失的问题。

Go 语言中的 JSON 处理

Go 语言的 encoding/json 包提供了强大的 JSON 序列化与反序列化功能。通过合理地使用结构体标签,我们可以控制 JSON 的编码与解码行为。

序列化:将大整数转为字符串

在 Go 语言中,如果我们有一个大整数,比如 math.MaxInt64,直接序列化为 JSON,那么在 JavaScript 中可能会丢失精度。为了解决这个问题,我们可以将大整数以字符串的形式序列化。

因为字符串不存在精度问题,从而从侧边也就解决了数字精度的问题。

type User struct {
   
    UserID int64  `json:"user_id,string"`
    Name   string `json:"name"`
    Age    int    `json:"age"`
}

func DigitalDistortionDemo() {
   
    data := User{
   
        UserID: math.MaxInt64,
        Name:   "Alex",
        Age:    18,
    }
    b, err := json.Marshal(data)
    if err != nil {
   
        log.Fatalf("json marshal failed: %v", err)
    }
    fmt.Printf("r1: %s\n", string(b))
}

在上述代码中,我们在 User 结构体的 UserID 字段上使用了 json:"user_id,string" 标签,这告诉 json.Marshal 函数将 UserID 以字符串的形式序列化。

反序列化:将字符串还原为大整数

当从前端接收到的 JSON 字符串中的 user_id 为字符串类型时,我们需要确保在反序列化过程中将其正确地转换回大整数。

func DigitalDistortionDemo1() {
   
    s := `{"user_id":"9223372036854775807","name":"Alex","age":18}`
    var user User
    if err := json.Unmarshal([]byte(s), &user); err != nil {
   
        log.Fatalf("json unmarshal failed: %v", err)
    }
    fmt.Printf("r2: %+v\n", user)
}

在这段代码中,json.Unmarshal 函数将 JSON 字符串中的 user_id 字段正确地解析为 User 结构体中的 UserID 字段,即使它是以字符串形式提供的。

这样也就完美解决了,我们后端的数值传给 js 前端,前端丢失精度的问题。

并且因为 js 前端需要字符串类型,而我们后端定义的类型是一个 int64 类型,通过只是加了一个 string json tag ,从而就优雅的解决了 js 前端无论接收还是传值都用 string,后端继续使用 int64 类型,不用再做类型转换问题。

结论

通过在 Go 语言中合理使用 encoding/json 包的结构体标签,我们可以有效地避免在 JSON 序列化与反序列化过程中的数字精度丢失问题。

这种方法对于处理大整数,特别是在与 JavaScript 环境交互时,尤为重要。希望本文能够帮助你更好地理解和应用 JSON 数据交换中的数字精度问题。

相关文章
|
8月前
|
前端开发 JavaScript 开发者
JavaScript:无处不在的Web语言
JavaScript:无处不在的Web语言
|
7月前
|
存储 安全 Java
【Golang】(4)Go里面的指针如何?函数与方法怎么不一样?带你了解Go不同于其他高级语言的语法
结构体可以存储一组不同类型的数据,是一种符合类型。Go抛弃了类与继承,同时也抛弃了构造方法,刻意弱化了面向对象的功能,Go并非是一个传统OOP的语言,但是Go依旧有着OOP的影子,通过结构体和方法也可以模拟出一个类。
377 2
|
9月前
|
Cloud Native 安全 Java
Go:为云原生而生的高效语言
Go:为云原生而生的高效语言
573 1
|
9月前
|
Cloud Native Go API
Go:为云原生而生的高效语言
Go:为云原生而生的高效语言
579 0
|
9月前
|
Cloud Native Java Go
Go:为云原生而生的高效语言
Go:为云原生而生的高效语言
408 0
|
9月前
|
Cloud Native Java 中间件
Go:为云原生而生的高效语言
Go:为云原生而生的高效语言
454 0
|
9月前
|
Cloud Native Java Go
Go:为云原生而生的高效语言
Go:为云原生而生的高效语言
507 0
|
JavaScript 前端开发
JavaScript类型判断
JavaScript类型判断
262 0
JavaScript类型判断
|
JavaScript 前端开发
JavaScript专题之类型判断(下)
JavaScript专题系列第五篇,讲解更加复杂的类型判断,比如 plainObject、空对象、类数组对象、Window对象、DOM 元素等
281 0
JavaScript专题之类型判断(下)

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
    1098
  • 2
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
    483
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
    373
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
    356
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
    475
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
    647
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
    1071
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(三):元素继承关系、层叠样式规则、字体属性、文本属性;针对字体和文本作样式修改
    257
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
    912
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
    437