>웹 프론트엔드 >JS 튜토리얼 >JSON 데이터 형식

JSON 데이터 형식

高洛峰
高洛峰원래의
2016-12-17 14:58:441230검색

기본 구조

JSON은 두 가지 구조로 구성됩니다.

1. 이름/값 쌍의 모음입니다. 다른 언어에서는 객체, 레코드, 구조체, 사전, 해시 테이블, 키 목록 또는 연관 배열로 이해됩니다.

2. 순서가 지정된 값 목록입니다. 대부분의 언어에서는 배열로 이해됩니다.

기본 예

간단히 말하면 JSON은 JavaScript 객체에 표현된 데이터 집합을 문자열로 변환할 수 있으며, 이 문자열은 함수 간에 쉽게 전달될 수 있습니다. 또는 비동기 애플리케이션에서는 문자열을 웹 클라이언트에서 서버측 프로그램으로 전달합니다. 이 문자열은 조금 이상해 보이지만 JavaScript는 이를 쉽게 해석할 수 있으며 JSON은 "이름/값 쌍"보다 더 복잡한 구조를 나타낼 수 있습니다. 예를 들어, 단순한 키와 값 목록이 아닌 배열과 복잡한 객체를 표현할 수 있습니다.

이름/값 쌍을 나타냅니다

가장 간단한 형식에 따르면 다음 JSON을 사용하여 "이름/값 쌍"을 나타낼 수 있습니다: { "firstName" : "Brett " }

이 예는 매우 기본적이며 실제로 동등한 일반 텍스트 "이름/값 쌍"보다 더 많은 공간을 차지합니다. firstName=Brett

그러나 여러 개의 " JSON을 추가하는 경우 이름/값 쌍이 함께 연결되면 자체적으로 나타납니다. 먼저 다음과 같은 여러 "이름/값 쌍"을 포함하는 레코드를 생성할 수 있습니다.

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

구문상 "이름/값 쌍"에 비해 큰 이점은 없지만 이 경우 JSON이 사용하기 쉽고 읽기 쉽습니다. 예를 들어, 위의 세 값이 동일한 레코드의 일부임을 분명히 합니다. 중괄호는 값을 어떻게든 연관시킵니다.

배열을 나타냅니다.

값 집합을 표현해야 하는 경우 JSON은 가독성을 높일 뿐만 아니라 복잡성도 줄일 수 있습니다. 예를 들어, 사람 이름 목록을 표현한다고 가정해 보겠습니다. XML에서는 많은 시작 및 종료 태그가 필요합니다. 일반적인 이름/값 쌍(이 시리즈의 이전 기사에서 본 것과 같은)을 사용하는 경우 독점 데이터 형식을 생성하거나 키 이름을 person1 형식으로 변경해야 합니다. -이름.

JSON을 사용하는 경우 여러 레코드를 중괄호로 그룹화하세요.

{ "people": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"},
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]}

이것은 이해하기 쉽습니다. 이 예에는 people이라는 변수가 하나만 있고 값은 세 항목의 배열입니다. 각 항목은 이름, 성, 이메일 주소를 포함하는 개인에 대한 레코드입니다. 위의 예에서는 괄호를 사용하여 레코드를 단일 값으로 결합하는 방법을 보여줍니다. 물론 여러 값(각각 여러 레코드 포함)을 동일한 구문을 사용하여 표현할 수 있습니다.

{ "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
] }

여기서 가장 주목할만한 점은 여러 값을 나타내는 기능입니다. 각 값에는 여러 값이 포함됩니다. 값. 그러나 레코드의 실제 이름/값 쌍은 주요 항목(프로그래머, 작성자 및 음악가)마다 다를 수 있다는 점에도 유의해야 합니다. JSON은 완전히 동적이므로 JSON 구조 중간에 데이터가 표현되는 방식을 변경할 수 있습니다.

JSON 형식의 데이터를 처리할 때 준수해야 하는 사전 정의된 제약 조건은 없습니다. 따라서 동일한 데이터 구조 내에서 데이터가 표현되는 방식이 바뀔 수 있으며, 동일한 내용이 다른 방식으로 표현될 수도 있습니다.

형식 적용

JSON 형식을 익히고 나면 JavaScript에서 사용하는 것은 매우 간단합니다. JSON은 기본 JavaScript 형식입니다. 즉, JavaScript에서 JSON 데이터를 처리하는 데 특별한 API나 툴킷이 필요하지 않습니다.

JSON 데이터를 변수에 할당

예를 들어 새 JavaScript 변수를 생성하고 여기에 JSON 형식 데이터 문자열을 직접 할당할 수 있습니다.

var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
] }

이것은 매우 간단합니다. 이제 사람들은 앞서 본 JSON 형식의 데이터를 포함합니다. 그러나 데이터에 접근하는 방법이 아직 명확하지 않아 이것만으로는 충분하지 않습니다.

데이터 접속

尽管看起来不明显,但是上面的长字符串实际上只是一个数组;将这个数组放进 JavaScript 变量之后,就可以很轻松地访问它。实际上,只需用点号表示法来表示数组元素。所以,要想访问 programmers 列表的第一个条目的姓氏,只需在 JavaScript 中使用下面这样的代码:

people.programmers[0].lastName;

注意,数组索引是从零开始的。所以,这行代码首先访问 people变量中的数据;然后移动到称为 programmers的条目,再移动到第一个记录([0]);最后,访问 lastName键的值。结果是字符串值 “McLaughlin”。

下面是使用同一变量的几个示例。

people.authors[1].genre // Value is "fantasy"
people.musicians[3].lastName // Undefined. This refers to the fourth entry, and there isn't one
people.programmers[2].firstName // Value is "Elliotte"

利用这样的语法,可以处理任何 JSON 格式的数据,而不需要使用任何额外的 JavaScript 工具包或 API。

 

修改 JSON 数据

正如可以用点号和括号访问数据,也可以按照同样的方式轻松地修改数据:

people.musicians[1].lastName = "Rachmaninov";

在将字符串转换为 JavaScript 对象之后,就可以像这样修改变量中的数据。

 

转换回字符串

当然,如果不能轻松地将对象转换回本文提到的文本格式,那么所有数据修改都没有太大的价值。在 JavaScript 中这种转换也很简单:

String newJSONtext = people.toJSONString();

这样就行了!现在就获得了一个可以在任何地方使用的文本字符串,例如,可以将它用作 Ajax 应用程序中的请求字符串。

更重要的是,可以将任何JavaScript 对象转换为 JSON 文本。并非只能处理原来用 JSON 字符串赋值的变量。为了对名为 myObject的对象进行转换,只需执行相同形式的命令:

String myObjectInJSON = myObject.toJSONString();

这就是 JSON 与本系列讨论的其他数据格式之间最大的差异。如果使用 JSON,只需调用一个简单的函数,就可以获得经过格式化的数据,可以直接使用了。对于其他数据格式,需要在原始数据和格式化数据之间进行转换。即使使用 Document Object Model 这样的 API(提供了将自己的数据结构转换为文本的函数),也需要学习这个 API 并使用 API 的对象,而不是使用原生的 JavaScript 对象和语法。

最终结论是,如果要处理大量 JavaScript 对象,那么 JSON 几乎肯定是一个好选择,这样就可以轻松地将数据转换为可以在请求中发送给服务器端程序的格式。

 

概念比较

JSON和XML的比较

◆可读性

JSON和XML的可读性可谓不相上下,一边是简易的语法,一边是规范的标签形式,很难分出胜负。

◆可扩展性

XML天生有很好的扩展性,JSON当然也有,没有什么是XML能扩展,而JSON却不能。不过JSON在Javascript主场作战,可以存储Javascript复合对象,有着xml不可比拟的优势。

◆编码难度

XML有丰富的编码工具,比如Dom4j、JDom等,JSON也有提供的工具。无工具的情况下,相信熟练的开发人员一样能很快的写出想要的xml文档和JSON字符串,不过,xml文档要多很多结构上的字符。

◆解码难度

XML的解析方式有两种:

一是通过文档模型解析,也就是通过父标签索引出一组标记。例如:xmlData.getElementsByTagName("tagName"),但是这样是要在预先知道文档结构的情况下使用,无法进行通用的封装。

另外一种方法是遍历节点(document 以及 childNodes)。这个可以通过递归来实现,不过解析出来的数据仍旧是形式各异,往往也不能满足预先的要求。

凡是这样可扩展的结构数据解析起来一定都很困难。

JSON也同样如此。如果预先知道JSON结构的情况下,使用JSON进行数据传递简直是太美妙了,可以写出很实用美观可读性强的代码。如果你是纯粹的前台开发人员,一定会非常喜欢JSON。但是如果你是一个应用开发人员,就不是那么喜欢了,毕竟xml才是真正的结构化标记语言,用于进行数据传递。

而如果不知道JSON的结构而去解析JSON的话,那简直是噩梦。费时费力不说,代码也会变得冗余拖沓,得到的结果也不尽人意。但是这样也不影响众多前台开发人员选择JSON。因为json.js中的toJSONString()就可以看到JSON的字符串结构。当然不是使用这个字符串,这样仍旧是噩梦。常用JSON的人看到这个字符串之后,就对JSON的结构很明了了,就更容易的操作JSON。

以上是在Javascript中仅对于数据传递的xml与JSON的解析。在Javascript地盘内,JSON毕竟是主场作战,其优势当然要远远优越于xml。如果JSON中存储Javascript复合对象,而且不知道其结构的话,我相信很多程序员也一样是哭着解析JSON的。

◆实例比较

XML和JSON都使用结构化方法来标记数据,下面来做一个简单的比较。

用XML表示中国部分省市数据如下:

<?xml version="1.0" encoding="utf-8"?>
<country>
    <name>中国</name>
    <province>
        <name>黑龙江</name>
     <cities>
            <city>哈尔滨</city>
            <city>大庆</city>
        </cities>
    </province>
    <province>
        <name>广东</name>
        <cities>
            <city>广州</city>
            <city>深圳</city>
            <city>珠海</city>
        </cities>
    </province>
</country>

用JSON表示如下:

{
{name:"中国", province:[ { name:"黑龙江", cities:{ city:["哈尔滨","大庆"] },
{name:"广东", cities:{ city:["广州","深圳","珠海"] } 
}

编码的可读性,xml有明显的优势,毕竟人类的语言更贴近这样的说明结构。json读起来更像一个数据块,读起来就比较费解了。不过,我们读起来费解的语言,恰恰是适合机器阅读,所以通过json的索引.province[0].name就能够读取“黑龙江”这个值。

编码的手写难度来说,xml还是舒服一些,好读当然就好写。不过写出来的字符JSON就明显少很多。去掉空白制表以及换行的话,JSON就是密密麻麻的有用数据,而xml却包含很多重复的标记字符。

 

JSON在线校验工具

前言

JSON格式取代了xml给网络传输带来了很大的便利,但是却没有了xml的一目了然,尤其是json数据很长的时候,我们会陷入繁琐复杂的数据节点查找中。

但是国人的一款在线工具 BeJson 给众多程序员带来了一阵凉风。

功能简介

1. JSON格式化校验

很多人在得到JSON数据后,一时没有办法判断JSON数据格式是否正确,是否少或多符号而导致程序不能解析,这个功能正好能帮助大家来完成JSON格式的校验。

2. JSON视图

想必很多程序员都会遇到当找一个节点的时候,会发现如果直接对着一行行数据无从下手,就算知道哪个位置,还要一个节点一个节点的往下找,万一一不留神又得从头开始找的麻烦事。

有了这个功能,一切JSON数据都会变成视图格式,一目了然,什么对象下有多少数组,一个数组下有多少对象。

这个功能非常实用。不光有视图功能还有格式化、压缩、转义、校验功能。总之很强大。

3. 压缩转义

程序员在写JSON语句测试用例的时候,很多时候为了方便直接写了个JSON字符串做测试,但是又陷入了无止境的双引号转义的麻烦中。这款功能集压缩、转义于一身,让你在写测试用例的时候,如鱼得水。

4. JSON在线编辑器

如果你现在的电脑刚巧没有装你所熟悉的编辑器,如果你想针对拿到的JSON数据的某个节点做数据修改时,这个功能可以满足你的需求。

5. 在线发送JSON数据

大家都知道,JSON用的最多的还是web项目的开发,那你要测试一个接口是否能准确的接受JSON数据,那你就得写一个页面发送JSON字符串,重复的做着这件事。随着这个功能的横空出世,你可以摆脱写测试页面了,因为这个功能可以将指定的JSON数据发送指定的url,方便吧。

6. JSON着色

很多人在写文档时,总希望文档能一目了然,但是面对着白底黑字的JSON数据总是提不起精神没关系,使用这个功能,所有的关键字都会被着色,数据结构一目了然。

7. JSON-XML互转

顾名思义,将JSON格式的数据转化成XML格式、或者XML格式的数据转化成JSON格式,一切都不是问题。


更多JSON 数据格式相关文章请关注PHP中文网!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.