浅析JSON序列化与反序列化

浅析JSON序列化与反序列化

JSON简介

JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于阅读和编写,同时也易于机器解析和生成。

JSON格式的数据结构包括以下几个部分:

  • 数组:用方括号([])表示,里面包含一组项,各项之间用逗号隔开。
  • 对象:用花括号({})表示,里面包含一组键值对,各键值对之间用逗号隔开,键和值之间用冒号隔开。
  • 值:可以是字符串、数字、布尔值、null、数组或对象。
  • 字符串:用双引号("")括起来的字符序列,可以包含转义字符(如回车符、制表符等)。

JSON序列化

JSON序列化是将数据从原有的数据类型转换为JSON格式的过程,一般是将复杂的对象或数组转换为JSON字符串。

在JavaScript中,可以使用JSON.stringify()方法进行JSON序列化。该方法接受一个JavaScript对象或数组作为参数,并返回一个JSON格式的字符串。例如:

var person = {
  "name": "张三",
  "age": 20,
  "hobbies": ["游泳", "篮球"],
  "address": {
    "street": "江南大道",
    "city": "上海",
    "state": "上海市"
  }
};

var jsonString = JSON.stringify(person);
console.log(jsonString);

上述代码中,我们定义了一个名为person的对象,包含一些信息,然后使用JSON.stringify()方法将该对象序列化为JSON字符串,最后输出结果为:

{"name":"张三","age":20,"hobbies":["游泳","篮球"],"address":{"street":"江南大道","city":"上海","state":"上海市"}}

从上述结果可以看出,对象的各个属性已经转换为了JSON格式,字符串值被加了双引号,数组和子对象都被转换为了对应的JSON格式。

JSON反序列化

JSON反序列化是将JSON格式的数据转换为原有的数据类型的过程,一般是将JSON字符串转换为JavaScript对象或数组。

在JavaScript中,可以使用JSON.parse()方法进行JSON反序列化。该方法接受一个JSON格式的字符串作为参数,并返回一个JavaScript对象或数组。例如:

var jsonString = '{"name":"张三","age":20,"hobbies":["游泳","篮球"],"address":{"street":"江南大道","city":"上海","state":"上海市"}}';
var person = JSON.parse(jsonString);
console.log(person);

上述代码中,我们定义了一个JSON格式的字符串,然后使用JSON.parse()方法将该字符串反序列化为JavaScript对象,最后输出结果为:

{
  name: '张三',
  age: 20,
  hobbies: [ '游泳', '篮球' ],
  address: { street: '江南大道', city: '上海', state: '上海市' }
}

从上述结果可以看出,JSON字符串已经转换为了JavaScript对象,所有字符串值被去掉了双引号,数组和子对象都被转换为了对应的JavaScript对象。

示例说明

示例一

现在我们定义一个包含函数的对象,然后将其序列化成JSON字符串:

var person = {
  "name": "张三",
  "age": 20,
  "hobbies": ["游泳", "篮球"],
  "address": {
    "street": "江南大道",
    "city": "上海",
    "state": "上海市"
  },
  "printInfo": function() {
    console.log(this.name + "的年龄是" + this.age + "岁,爱好是" + this.hobbies.join("、") + ",住在" + this.address.city + "市" + this.address.street);
  }
};

var jsonString = JSON.stringify(person);
console.log(jsonString);

运行以上代码后,会发现会报错如下所示:

TypeError: Converting circular structure to JSON

这是因为JSON序列化需要将对象的属性及其值都转换为字符串形式,而函数类型的值则无法转换为字符串。因此,如果需要序列化带有函数类型属性的对象,需要先手动将这些属性删除。

示例二

现在我们尝试将一个JSON字符串反序列化成JavaScript对象,并对其中的一些属性进行修改:

var jsonString = '{"name":"张三","age":20,"hobbies":["游泳","篮球"],"address":{"street":"江南大道","city":"上海","state":"上海市"}}';
var person = JSON.parse(jsonString);
console.log(person);

person.name = "李四";
person.age = 25;
person.hobbies.push("跑步");
person.address.city = "北京";

console.log(person);

运行以上代码后,可以看到第一个输出的结果是反序列化后的JavaScript对象,第二个输出的结果是修改后的JavaScript对象。

从以上两个示例中,我们可以看出JSON序列化与反序列化的基本使用方法,以及一些需要注意的细节。在实际开发中,JSON序列化与反序列化常被用于通过网络传输数据,或将数据存储到本地文件。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:浅析JSON序列化与反序列化 - Python技术站

(0)
上一篇 2023年6月11日
下一篇 2023年6月11日

相关文章

  • JavaScript暂停和继续定时器的实现方法

    JavaScript中定时器有两种类型:setInterval和setTimeout。这两种定时器的实现原理都是通过JavaScript引擎维护一个定时器队列来实现。当一个定时器到期时,会将对应的回调函数加入到待执行的任务队列中,等待JavaScript引擎进行执行。 暂停定时器 在JavaScript中暂停定时器有许多方法,以下是其中两种实现方式。 方式一…

    JavaScript 2023年6月11日
    00
  • JavaScript实现数值自动增加动画

    JavaScript实现数值自动增加动画 简介 数值自动增加动画是Web开发中经常使用的一种交互效果,可以应用在比如数字滚动、统计数据等场景。本文将介绍使用JavaScript实现数值自动增加动画的完整攻略,包括实现原理、具体实现步骤和示例说明。 实现原理 实现数值自动增加动画的基本原理是利用定时器setInterval()循环计算数值,并更新数值显示。具体…

    JavaScript 2023年6月10日
    00
  • JavaScript中立即执行函数实例详解

    JavaScript中的立即执行函数是指在定义后立即执行的函数,该函数执行后,返回值即被抛弃,仅保留函数内部的执行结果,不会对全局环境造成污染。本文将详细讲解JavaScript中立即执行函数的各个方面,包括基本语法、应用示例以及优缺点等。 基本语法 JavaScript中的立即执行函数需要使用一对匿名函数进行定义,但为了避免匿名函数对全局环境造成影响,并使…

    JavaScript 2023年5月27日
    00
  • JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析

    对于JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析,我们可以按照以下步骤进行攻略。 1. 简介 在前端开发中,我们经常需要对HTML文档中的元素进行操作。HTML DOM (Document Object Model)提供了一系列操作HTML文档元素的方法,使得我们可以方便地实现对元素的新增、编辑和删除等操作。 2. 元素…

    JavaScript 2023年6月10日
    00
  • javascript 数组的定义和数组的长度

    数组是JavaScript中最常用的数据结构之一,可以用来存储多个值。在JavaScript中,数组的定义和长度可以用以下方式来实现: 定义数组 定义一个空数组 javascript let arr = []; 定义一个带有数据的数组 javascript let arr = [1, 2, 3]; 可以通过 Array 构造函数创建数组 javascript…

    JavaScript 2023年5月27日
    00
  • JavaScript原生数组函数实例汇总

    JavaScript原生数组函数是JavaScript编程中非常重要的一部分。这些函数非常高效,可以帮助我们轻松地对数组进行操作,而无需手动编写重复的循环代码。下面是JavaScript原生数组函数实例汇总的完整攻略。 什么是JavaScript原生数组函数? JavaScript原生数组函数是指JavaScript中定义好的、可以直接使用的针对数组进行操作…

    JavaScript 2023年5月27日
    00
  • ES6数组的扩展详解

    ES6数组的扩展详解 在ES6中,数组的概念得到了进一步扩展和完善,提供了一些新的方法和语法糖,使得开发人员在对数组进行操作时具有更多的便利性。 扩展运算符 在ES6中,一个新的运算符…被引入,称为扩展运算符(spread operator)。扩展运算符可以将数组展开为一系列的参数,方便我们对多个参数进行操作。 示例1:合并数组 const arr1 =…

    JavaScript 2023年5月27日
    00
  • JS简单生成随机数(随机密码)的方法

    生成随机数或随机密码是前端开发中比较常见的需求。在JavaScript中,我们可以通过Math对象来生成随机数。下面是完整的攻略: 1. 生成随机整数 生成随机整数的代码如下: // 生成随机整数 function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max); re…

    JavaScript 2023年5月28日
    00
合作推广
合作推广
分享本页
返回顶部