JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。 易于人阅读和编写,同时也易于机器解析和生成。 XML也是一种数据交换格式,为什么没有选择XML呢?因为XML虽然可以作为跨平台的数据交换格式,但是在JS中处理XML非常不方便,同时XML标记比数据多,增加了交换产生的流量,而JSON没有附加的任何标记,在JS中可作为对象处理,所以我们更倾向于选择JSON来交换数据。

一.json结构及形式

结构1:

  “名称/值”对的集合(A collection of name/value pairs)。不同的语言中,它被理解为对象(object),纪录(record),结构(struct),字典(dictionary),哈希表(hash table),有键列表(keyed list),或者关联数组 (associative array)。

对应的形式为:

  对象是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔。

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }

结构2:

  值的有序列表(An ordered list of values)。在大部分语言中,它被理解为数组(array)。

对应的形式为:

  数组是值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。

[
{
key1:value1,
key2:value2
},
{
key3:value3,
key4:value4
}
]

二.json字符串转化为json对象

字符串(string)是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义。一个字符(character)即一个单独的字符串(character string)。字符串(string)与C或者Java的字符串非常相似。

对应的形式:

 var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";

字符串json转化json对象有三种方式:

1.通过eval( ) 方法将字符串直接转化为JSON对象 并获得元素的值。

 <script type="text/javascript">
window.onload = function(){
var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";
//使用eval()将字符串转换为对象
var json_obj = eval("("+ json_text +")");
//访问 book-name
document.write(json_obj.book.name);
//访问 book-author-Xu
document.write(json_obj.book.author[1]);
}
</script>

注意:"()"运算符

2.new Function形式

<script type="text/javascript">
window.onload = function(){
var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";
//用new Function将字符串转换为对象
var json_obj = (new Function("return" + json_text))();
//访问 book-name
document.write(json_obj.book.name);
//访问 book-author-Xu
document.write(json_obj.book.author[1]);
}
</script>

3.使用全局的JSON对象

<script type="text/javascript">
window.onload = function(){
var json_text = '{"book":"js"}';
//用全局JSON将字符串json转换为json对象
var json_obj = JSON.parse(json_text);
//访问 book-name
document.write(json_obj.book);
//访问 book-author-Xu
//document.write(json_obj.book.author[1]);
}
</script>

目前IE8(S)/Firefox3.5+/Chrome4/Safari4/Opera10 已实现了该方法。注意:'{"book":"js"}'; 里面的属性需要用双引号引起来,才能解析,否则会失败。

三.json校验格式化工具简单实现

做了一个比较简单的json格式化工具,效果如下:

初始数据:

json格式化后的数据:

代码分析:

<body>
<textarea id="content_value">
</textarea>
<input type="button" value="格式化" onclick="check()">
<textarea id="output_value">
</textarea>
</body>
<script type="text/javascript">
function check(){
  var text_value = document.getElementById('content_value').value;
  if(text_value == ""){
  alert("不能为空");
  return false;
  } else {
var res="";
for(var i=0,j=0,k=0,ii,ele;i<text_value.length;i++)
{//k:缩进,j:""个数
ele=text_value.charAt(i);
if(j%2==0&&ele=="}")
{
k--;
for(ii=0;ii<k;ii++) ele=" "+ele;
ele="\n"+ele;
}
else if(j%2==0&&ele=="{")
{
ele+="\n";
k++;
debugger;
for(ii=0;ii<k;ii++) ele+=" ";
}
else if(j%2==0&&ele==",")
{
ele+="\n";
for(ii=0;ii<k;ii++) ele+=" ";
}
else if(ele=="\"") j++;
res+=ele;
}
  document.getElementById('output_value').value = res;
  }
}
</script>

参考资料:

http://www.json.org/json-zh.html

http://www.cnblogs.com/mcgrady/archive/2013/06/08/3127781.html

http://www.cnblogs.com/SkySoot/archive/2012/04/17/2453010.html

http://www.cnblogs.com/xugang/archive/2010/09/10/1823422.html

http://www.cnblogs.com/snandy/archive/2011/03/13/1981611.html

http://www.cnblogs.com/know/archive/2011/03/13/1982839.html

json数据格式及json校验格式化工具简单实现的更多相关文章

  1. json数据格式及json格式化工具推荐

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于编程语言的文本格式来存储和表示数据. 易于人阅读和编写,同时也易于机器解析和生成. XML也 ...

  2. toJSON() 方法,将 Date 对象转换为字符串,并格式化为 JSON 数据格式。

    JavaScript toJSON() 方法 定义和用法 toJSON() 方法可以将 Date 对象转换为字符串,并格式化为 JSON 数据格式. JSON 数据用同样的格式就像x ISO-8601 ...

  3. 利用JSON Schema校验JSON数据格式

    最近笔者在工作中需要监控一批http接口,并对返回的JSON数据进行校验.正好之前在某前端大神的分享中得知这个神器的存在,调研一番之后应用在该项目中,并取得了不错的效果,特地在此分享给各位读者. 什么 ...

  4. json数据格式的简单案例

    json数据是一种文本字符串,它是javascript的原生数据格式,在数据需要多次重复使用时,json数据是ajax请求的首先.(注:ajax返回的数据格式支持三种分别为:文本格式,json.和xm ...

  5. 基于json数据格式实现的简单数据库——jsonDB

    已在github上建立项目:https://github.com/ThinkerCodeChina/jsonDB /** +-------------------------------------- ...

  6. $Django ajax简介 ajax简单数据交互,上传文件(form-data格式数据),Json数据格式交互

    一.ajax  1 什么是ajax:异步的JavaScript和xml,跟后台交互,都用json  2 ajax干啥用的?前后端做数据交互:  3 之前学的跟后台做交互的方式:   -第一种:在浏览器 ...

  7. Android中JSON数据格式的简单使用

    源码: package com.wangzhu.demo; import java.io.BufferedReader; import java.io.IOException; import java ...

  8. JSON 数据格式

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.JSON采用完全独立于语言的文本格式,这些特性使JSON成为理想的数据交换语言.易于人阅读和编写,同时也易 ...

  9. JSON数据格式

    JSON 数据格式 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.JSON采用完全独立于语言的文本格式,这些特性使JSON成为理想的数据交换语言.易于人 ...

随机推荐

  1. Html Agility Pack 解析Html

    Hello 好久不见 哈哈,今天给大家分享一个解析Html的类库 Html Agility Pack.这个适用于想获取某网页里面的部分内容.今天就拿我的Csdn的博客列表来举例. 打开页面  用Fir ...

  2. 从源码看Azkaban作业流下发过程

    上一篇零散地罗列了看源码时记录的一些类的信息,这篇完整介绍一个作业流在Azkaban中的执行过程,希望可以帮助刚刚接手Azkaban相关工作的开发.测试. 一.Azkaban简介 Azkaban作为开 ...

  3. 深入浅出Redis-redis底层数据结构(上)

    1.概述 相信使用过Redis 的各位同学都很清楚,Redis 是一个基于键值对(key-value)的分布式存储系统,与Memcached类似,却优于Memcached的一个高性能的key-valu ...

  4. 在线浏览PDF之PDF.JS (附demo)

    平台之大势何人能挡? 带着你的Net飞奔吧!:http://www.cnblogs.com/dunitian/p/4822808.html#skill 下载地址:http://mozilla.gith ...

  5. js获取给定月份的N个月后的日期

    1.在讲js获取给定月份的N个月后的日期之前,小颖先给大家讲下getFullYear().getYear()的区别. ①getYear() var d = new Date() console.log ...

  6. 《Django By Example》第一章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:本人目前在杭州某家互联网公司工作, ...

  7. ASP.NET Core应用针对静态文件请求的处理[4]: DirectoryBrowserMiddleware中间件如何呈现目录结构

    和StaticFileMiddleware中间件一样,DirectoryBrowserMiddleware中间本质上还是定义了一个请求地址与某个物理目录之间的映射关系,而目标目录体现为一个FilePr ...

  8. C#多线程之线程同步篇2

    在上一篇C#多线程之线程同步篇1中,我们主要学习了执行基本的原子操作.使用Mutex构造以及SemaphoreSlim构造,在这一篇中我们主要学习如何使用AutoResetEvent构造.Manual ...

  9. 前端制作动画的几种方式(css3,js)

    制作动态的网页是是前端工程师必备的技能,很好的实现动画能够极大的提高用户体验,增强交互效果,那么动画有多少实现方式,一直对此有选择恐惧症的我就总结一下,以便在开发的时候选择最好的实现方式. 1.css ...

  10. CSS 3 学习——渐变

    通过CSS渐变创建的是一个没有固定比例和固定尺寸的<image>类型,也就是说是一张图片,这张图片的尺寸由所应用的元素的相关信息决定.凡是支持图片类型的CSS属性都可以设置渐变,而支持颜色 ...