JSON与js对象序列化实例详解

本文实例讲述了JSON与js对象序列化。分享给大家供大家参考,具体如下:

JavaScript对象表示法(JavaScript Object Notation,简称JSON)是一种轻量级的数据交换格式,它基于js字面量表示法,是js的一个子集。虽然是一个js的子集但是他与语言无关,它可以用于在现在所有的编程语言编写的应用程序之间进行数据交换。是一种文本格式,比较容易读写。

JSON是一个容纳“名/值”对的无序集合,名字可以是任意字符串,值可以使任意的JSON类型的值。大多数编程语言都有被映射为JSON的数据类型,比 如对象(object),字典(dictionary),哈希表(hash map),关联数组(associative array)等。

JSON有六种类型的值:对象,数组,字符串,数字,布尔值和特殊值null。

console.log(JSON.parse('5')); // 5
console.log(JSON.parse(5)); // 5
console.log(JSON.parse('true')); // true
console.log(JSON.parse(true)); // true
console.log(JSON.parse('"hello"')); // "hello"
console.log(JSON.parse("hello")); // 报错 因为hello不是JSON字符串
console.log(JSON.parse('null')); // null
console.log(JSON.parse(null)); // null
console.log(JSON.parse(undefined)); // 报错 因为JSON不能表示undefined换用null代替

JSON的结构

JSON具有两种结构:对象,数组

对象结构以”{”大括号开始,以”}”大括号结束。中间部分由0或多个以”,”分隔的”key(关键字)/value(值)”对构成,关键字字符串和值之间以”:”分隔,语法结构如代码。

{
  key1:value1,
  key2:value2,
  ...
}

例如:

{
  "name": "hum",
  "age": 26,
  "sex": 1,
  "love": [
    "swing",
    "jump"
  ],
  "birthday": "1988-01-12"
}

NOTE:

在js中表示JSON字符串时最好在外面加上单引号。

如下:

代码如下:

console.log(JSON.parse('{"num":5,"stop":true,"str":"hello","empty":null}'));// object{num:5,stop:true,str:"hello",empty: null}

与js对象字面量相比,JSON对象没有变量声明也没有末尾的分号。
数组结构以”[”开始,”]”结束。中间由0或多个以”,”分隔的值列表组成,语法结构如代码。

[
  {
    key1:value1,
    key2:value2,
   ...
  }
]

例如:

[
 {
   "Id": 7,
  "Mentions": [
    {
     "Id": 5,
     "StatusId": 34,
     "CreatedDateTime":"\/Date(1310051914617+0100)\/",
     "Text":"Text",
     "UserName":"Username",
    "UserLocation":"UK",
    "UserLanguage":"en-GB",
     "IsCheckIn":"true"
   }
  ],
   "Checkins": 0,
   "HereNow": 0,
   "TimeStamp":"\/Date(1310051914639+0100)\/",
   "Venue": {
    "Id": 7,
    "FoursquareId":"cacbf3bd-f0aa-403d-9f9b-2056b4985ba1",
    "Name":"Venue Name"
   }
  },
  {
    "name":"hahahhahah",
    "port":[
     {
       "port": 8080,
       "protocol":"HTTP",
       "IP":"123.12.06.456"
     }
    ]
  }
]

JSON数组采用的是javascript数组字面量的形式。

JSON的解析与序列化

js的JSON的解析与序列化与AS3是相同的。我们常用的也就是JSON对象(ECMAScript 5中添加的, 早期JSON解析基本都使用javascript的eval()函数。但是eval有一些性能和安全上的缺点,ECMAScript对解析JSON对象进 行了规范,定义了全局对象JSON,支持的浏览器有标准浏览器和IE8+。对于不支持的浏览器可以引入json2.js文件。)的stringify与parse这两个方法。

接下来我们来一一说明。

JSON.stringify

JSON.stringify()将javascript对象序列化为JSON格式的字符串
JSON.stringify(ob,filter,indent)包含三个参数,通常我们在使用的时候只带第一个参数,来返回字符串。

ob:要转化成JSON字符串的对象,数组,原始值。
filter:是一个可选的参数,通常是一个函数,用来在字符串化前对值做一些替换。也可以是一个数组,包含哪些需要字符串化的属性名。就是用来过滤的。
indent:也是一个可选参数,在需要输出格式化的可阅读的代码时,使用indent参数来指定用来缩进的字符串或空格。如果省略该参数,返回的字符串将不带任何的额外的空格,这样输出的值很难阅读。就是用来格式化的。

下面是几个对应的例子:

首先是第二个参数是数组过滤器的时候:

var oJson = { name: 'hum', age: 20, sex: 1};
console.log(JSON.stringify(oJson, ['age', 'sex'])); // {"age":20,"sex":1}

如果第二个参数是字符串的时候,该数组会作为对象的属性名,属性名不在这个数组中的任何对象的属性在序列化的时候都会被忽略掉。此外,返回的字符串中的属性的顺序,会与该数组中的属性名一致。

函数过滤器的时候:

var oJson = { name: 'hum', age: 26, sex: 1, love: ['swing', 'jump']};
  console.log(JSON.stringify(oJson, function(k, v){
    switch (k){
      case 'age':
        return v > 20 ? '成年': '未成年';
      case 'love':
        return v.join(',');
      case 'sex':
        return undefined;
      default :
        return v;
    }
  })); // {"name":"hum","age":"成年","love":"swing,jump"}

如果该参数是函数,则它是一个替换函数,该函数会在每一个需要字符串化的对象上调用。这个函数的第一个参数是该对象中的属性名或数组的序号,第二个则是值本身。函数的返回值会替换掉需要字符串化的值,如果函数返回undefined或没有任何的返回值,则会在字符串化的时候忽略这个值。

stringify的第三个参数的实例:

var oJson = { name: 'hum', age: 26, sex: 1, love: ['swing', 'jump']};
  console.log(JSON.stringify(oJson, null, 4));
  /*
   {
     "name": "hum",
     "age": 26,
     "sex": 1,
     "love": [
       "swing",
       "jump"
     ]
   }
  */

通常这个方法的返回值是一个不带任何空格或换行符的给机器阅读的字符串,如果想输出更易于阅读的代码,就需要设置第三个参数了。

再来看一个例子:

var oJson = { name: 'hum', age: 26, sex: 1, love: ['swing', 'jump']};
  console.log(JSON.stringify(oJson, null, '--'));
  /*
   {
   --"name": "hum",
   --"age": 26,
   --"sex": 1,
   --"love": [
   ----"swing",
   ----"jump"
   --]
   }
  */

这样就很容易理解了。。。

JSON.parse

JSON.parse用来解析json格式的字符串(返回一个对象,数组或原始值)

JSON.parse(s,reviver)包含两个方法.

s:要解析的字符串
reviver:用来转换解析值得可选函数

我们通常使用只使用第一个参数,可选参数reviver,主要是在返回解析值之前,对其进行过滤或后期处理。reviver函数会在从s中解析的每个原始值调用一次。调用reviver函数是带有两个参数,第一个属性名(对象的属性名或是转换成字符串的数组序号),第二个参数是对象的属性或是数组的元素值。reviver函数会作为包含原始值的对象/数组的方法来调用。reviver函数的返回值会成为属性的新值,如果reviver返回第二个参数,则属性不变。如果reviver返回undefined或不凡会任何值,则会从对象或是数组中删除属性。
下面是一个实例:

var oJson = { name: 'hum', age: 26, sex: 1, love: ['swing', 'jump'], birthday: '1988-01-12'};
  var sJson = JSON.stringify(oJson);
  console.log(sJson);//{"name":"hum","age":26,"sex":1,"love":["swing","jump"],"birthday":"1988-01-12"}
  console.log(JSON.parse(sJson));
  console.log(JSON.parse(sJson, function (k, v) {
    if(k == 'birthday'){ // 返回日期对象
      return new Date(v);
    }else if(k == 'sex'){ // sex不在了
      return undefined;
    }else{
      return v;
    }
  }));

PS:关于json操作,这里再为大家推荐几款比较实用的json在线工具供大家参考使用:

在线JSON代码检验、检验、美化、格式化工具:
http://tools.jb51.net/code/json

JSON在线格式化工具:
http://tools.jb51.net/code/jsonformat

在线XML/JSON互相转换工具:
http://tools.jb51.net/code/xmljson

json代码在线格式化/美化/压缩/编辑/转换工具:
http://tools.jb51.net/code/jsoncodeformat

在线json压缩/转义工具:
http://tools.jb51.net/code/json_yasuo_trans

C语言风格/HTML/CSS/json代码格式化美化工具:
http://tools.jb51.net/code/ccode_html_css_json

更多关于JavaScript相关内容可查看本站专题:《JavaScript中json操作技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

(0)

相关推荐

  • JSON序列化与解析原生JS方法且IE6和chrome测试通过

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • js解析与序列化json数据(一)json.stringify()的基本用法

    早期的JSON解析器基本上就是使用JavaScript的eval()函数.由于JSON是JavaScript语法的自己,因此eval()函数可以解析.解释并返回JavaScript的对象和数组. ECMAScript 5对解析JSON的行为进行了规范,定义了全局对象JSON. JSON对象有两个方法:stringify()和parse().在最简单的情况下,这两个方法分别用于把JavaScript对象序列化为JSON字符串和把JSON字符串解析为原生JavaScript.例如: 新建一个HTML

  • JS实现json的序列化和反序列化功能示例

    本文实例讲述了JS实现json的序列化和反序列化功能.分享给大家供大家参考,具体如下: 序列化: var s = new Object(); s.Name = "clientValue"; s.Id = 1; s.ClassId = 2; var data = JSON.stringify(s); console.log(data); 反序列化: eval将字符串反序列化成对象 var s = eval('(' + data+ ')'); console.log(s.Name); 完整

  • Jquery 组合form元素为json格式,asp.net反序列化

    作者:敖士伟 Email:ikmb@163.com 转载注明作者 说明: 1.js根据表单元素class属性,把表单元素的name和value组合为json格式;用表单元素class属性可以针对性地组合JSON数据. 2.后端ASP.NET用JavaScriptSerializer反序列化为对象实列. 3.好处:简化了前端数据读取与后端数据赋值. 复制代码 代码如下: function GetJSONStr(class_name) { var a = []; //文本框 $("." +

  • js解析与序列化json数据(二)序列化探讨

    上一节我们讲解了JSON.stringify()的基本用法,这一节我们来重点探讨一下序列化. JSON.stringify()除了要序列化的js对象外,还可以接收另外两个参数,这两个参数用于指定不同方式序列化js对象.第一个参数是过滤器,可以使一个数组,也可以是一个函数:第二个参数是一个选项,表示是否在JSON字符串中保留缩进.单独或组合使用这两个参数,可以更全面深入地控制JSON的序列化. 1.过滤结果 如果过滤器参数是数组,那么JSON.stringify()的结果中将只包含数组中列出的属性

  • JSON键值对序列化和反序列化解析

    什么是JSON? JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write and easy for machines to parse and generate. JSON is a text format that is completely language independent. 翻译:Json[javascrip

  • Json序列化和反序列化方法解析

    复制代码 代码如下: /// <summary>        /// Json序列化,用于发送到客户端        /// </summary>        public static string ToJsJson(this object item)        { DataContractJsonSerializer serializer = new DataContractJsonSerializer(item.GetType()); using (MemoryStr

  • js解析与序列化json数据(三)json的解析探讨

    这一节我们主要讨论json的解析. JSON.parse()方法也可以接收另一个参数,该参数是一个函数,将早每个键值对上调用.为了区别JSON.stringify()接收的替换(过滤)函数(replacer),这个函数被称作还原函数(reviver),但实际上这两个函数的签名是相同的--它们都接收连个参数,一个键和一个值,而且都需要返回一个值. 如果还原函数返回undefined,则表示要从结果中删除相应的键:如果返回其他值,则将该值插入到结果中.如: 复制代码 代码如下: <html> &l

  • 浅析JSON序列化与反序列化

    方法一:引入System.Web.Script.Serialization命名空间使用 JavaScriptSerializer类实现简单的序列化序列化类:Personnel 复制代码 代码如下: public class Personnel        {            public int Id { get; set; }            public string Name { get; set; }        } 执行序列化反序列化: 复制代码 代码如下: prote

  • JSON与js对象序列化实例详解

    本文实例讲述了JSON与js对象序列化.分享给大家供大家参考,具体如下: JavaScript对象表示法(JavaScript Object Notation,简称JSON)是一种轻量级的数据交换格式,它基于js字面量表示法,是js的一个子集.虽然是一个js的子集但是他与语言无关,它可以用于在现在所有的编程语言编写的应用程序之间进行数据交换.是一种文本格式,比较容易读写. JSON是一个容纳"名/值"对的无序集合,名字可以是任意字符串,值可以使任意的JSON类型的值.大多数编程语言都有

  • Json转化为Java对象的实例详解

    Json转化为Java对象的实例详解 问题:前后端数据交互时,经常会遇到Json串与Java对象转化的问题,有的Java对象中还包含了List对象等. 解决方案: 引入 json-lib包,Maven坐标如下: <dependency> <groupId>net.sf.json-lib</groupId> <artifactId>json-lib</artifactId> <version>2.4</version> &l

  • Node.js Domain 模块实例详解

    Node.js Domain(域) 简化异步代码的异常处理,可以捕捉处理try catch无法捕捉的异常. Domain 模块可分为隐式绑定和显式绑定: 隐式绑定: 把在domain上下文中定义的变量,自动绑定到domain对象 显式绑定: 把不是在domain上下文中定义的变量,以代码的方式绑定到domain对象 创建domain.js,代码如下: var eventEmitter=require("events").EventEmitter; var domain=require(

  • php将xml转化对象的实例详解

    XML文件 $xml= "123456"; 将文件转换成对象 $objectxml = simplexml_load_string($xml); 将对象转换个JSON $xmljson= json_encode($objectxml ); 将json转换成数组 $xmlarray=json_decode($xmljson,true); 内容扩展: PHP将XML转换成数组/对象 $xml= "<xml><appid>123456</appid&g

  • JSP中out对象的实例详解

    JSP中out对象的实例详解 一 什么是缓冲区 缓冲区:Buffer,所谓缓冲区就是内存的一块区域用来保存临时数据. 二 out对象 out对象是JspWrite类的实例,是向浏览器输出内容常用的对象. 三 常用方法 四 实例 <%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8"%> <% String path

  • JSP的response对象的实例详解

    JSP的response对象的实例详解 一 response对象 response对象包含了响应客户请求的有关信息,但在JSP中很少直接用到它.它是HttpServletResponse类的实例.response对象具有页面作用域,即访问一个页面时,该页面内的response对象只能对这次访问有效,其他页面的response对象对当前页面无效. 二 response对象常用的方法 三 实战 <%@ page language="java" import="java.ut

  • IOS 简单的本地json格式文件解析的实例详解

    IOS 简单的本地json格式文件解析的实例详解 ljweibo.json文件 { "data":[{ "name" : "孙悟空", "content" : "7月12日的国务院常务会议上,李克强明确要求,要将已审议的<快递条例(草案)>向社会公开征求意见.在会上,总理说了这么一段话:"几年前,快递业刚刚开始发展的时候,有些城市不允许快递存在,理由是影响市容整洁,快递员骑的摩的也不允许停放.但

  • 关于动态执行代码(js的Eval)实例详解

    熟悉javascript的朋友对Eval()函数可能都不会陌生,我们可以用它来实现动态代码的执行,我自己甚至写过一个网页专门用来计算算术表达式的,计算能力上比google.baidu的计算器还要好一些,至少精度要高,但是如果超出了四则运算的话,表达式的形式会复杂很,比如以百度给出的例子: log((5+5)^2)-3+pi需要写成Math.log(Math.pow(5+5,2))*Math.LOG10E-3+Math.PI才能用Eval进行计算,对于这一点我还没有想到理想的解决方案.好了,这不是

  • 用Newtonsoft将json串转为对象的方法(详解)

    首先,将json串转为一个JObject对象: JObject jo = (JObject)JsonConvert.DeserializeObject(CurrentSelectedItemReq); 这个JObject是一个"值对"类型,比如说我们的json串是这样: { "rows":[ [ {"NumIid":"001"}, {"PicUrl":"xxx.png"}, {"

  • Python对象与json数据的转换问题实例详解

    目录 JSON 函数 使用 JSON 函数需要导入 json 库:import json. json.dumps 语法 实例 实例 实例 json.loads 语法 实例 实例 使用第三方库:Demjson 环境配置 JSON 函数 encode 语法 实例 实例 decode 语法 实例 实例 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,易于人阅读和编写. JSON 函数 使用 JSON 函数需要导入 json 库:import json. 函

随机推荐