uniApp中使用JSON.stringify和JSON.parse进行序列化与反序列化

最新推荐文章于 2024-06-14 09:57:31 发布

前端uio

最新推荐文章于 2024-06-14 09:57:31 发布

阅读量826

点赞数 22

文章标签： uni-app json 前端 vue.js javascript

本文链接：https://blog.csdn.net/weixin_52231116/article/details/139327884

版权

大家好~ 我是前端uio，本文主要介绍uniApp中使用JSON.stringify和JSON.parse进行序列化与反序列化。有什么疑问都欢迎私聊或者在评论区留言。如果需要开发web网页或者微信小程序都可以找我私聊，我会尽可能回答我了解的内容。

一、基本介绍

1.JSON格式

① JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，基于JavaScript的一个子集，但实际上是独立于语言的。

② JSON格式易于人阅读和编写，同时也易于机器解析和生成。

③ JSON数据格式主要用于数据的存储和传输，尤其是在 Web 应用程序中，常被用来在客户端和服务器之间交换数据。

2.JSON格式的特点

① 数据结构：JSON 数据结构主要有两种：对象和数组。

② 对象：使用大括号 {} 包围，内部由键值对组成，键必须是字符串，并且用双引号括起来，值可以是字符串、数字、布尔值、数组或另一个对象。

③ 数组：使用方括号 [] 包围，内部由一系列值组成，这些值可以是字符串、数字、布尔值、数组或对象。

④ 数据类型：JSON支持的数据类型包括字符串、数字、布尔值、数组和对象。

⑤ 格式规范：JSON格式要求严格，包括数据类型的限制、键名的引用方式、数据的排列顺序等。

3.示例

player 是一个对象，它包含了一个名为 player 的数组，数组中又包含了三个玩家的信息，每个玩家信息是一个对象，包含了姓名、年龄等属性。

{
  "player": [
    {"name": "胡桃", "age": 18, "desc": "girl"},
    {"name": "原", "age": 18, "desc": "circle"}
  ]
}

4. JSON格式与JavaScript对象的关系

JSON 格式与 JavaScript 对象在语法上非常相似，事实上，JSON可以视为 JavaScript 对象的字符串表示形式。在JavaScript中，可以使用JSON.stringify 方法将JavaScript对象转换为JSON字符串，使用 JSON.parse 方法将 JSON 字符串转换为 JavaScript 对象。这种转换使得 JSON 成为了一种方便的数据交换格式，因为它既可以被人类阅读，也可以被编程语言轻松解析。

5.JSON格式的重要性

JSON格式因其简洁性和易读性而广泛应用于Web开发中，是现代Web应用程序中常见的数据格式之一。无论是在前端还是后端，无论是在客户端还是服务器端，JSON 都扮演着至关重要的角色。它不仅简化了数据的传输和存储，还提高了数据处理的效率和灵活性。

二、JSON.stringify 在 uniApp 的应用

在 uniApp 中，JSON.stringify 方法用于将 JavaScript 对象转换成 JSON 字符串。这个方法，在需要将数据发送到服务器或者存储在本地文件时很实用。

// 假设有一个对象
let userInfo = {
  name: "胡桃",
  age: 18
};

// 使用 JSON.stringify 将对象转换为 JSON 字符串
let jsonString = JSON.stringify(userInfo);

// 输出 JSON 字符串
console.log(jsonString);  //{"name":"胡桃,"age":18 }

三、JSON.parse 在 uniApp 的应用

JSON.parse 方法用于将 JSON 字符串转换回 JavaScript 对象。这个方法在接收服务器响应或者从本地文件读取数据时非常有用。

示例中，jsonString 被转换成了一个 JavaScript 对象，并存储在 userInfo 变量中。如果打开浏览器的控制台查看 userInfo 的值，可看到与原始 userInfo 对象相同的结构。

// 假设有一个 JSON 字符串
let jsonString = '{"name":"胡桃","age":18}';

// 使用 JSON.parse 将 JSON 字符串转换为 JavaScript 对象
let userInfo = JSON.parse(jsonString);

// 输出 JavaScript 对象
console.log(userInfo);