1. 정의

JavaScript Object Notation

자바스크립트에서 데이터(객체)를 받아 할당하여 표현하는 자료 표현 방법

경량 데이터를 xml 보다 간단하게 표현하기 위해 만든 프레임워크

xml 보다 기능이 적기 때문에 파싱 속도도 상대적으로 빠르고 간단하여 클라이언트 사이드(ex. 모바일)에서 유용하게 쓰임

name/value가 쌓인 컬렉션 타입으로 이루어져 있음

Ajax로 서버와 통신시 데이터를 주고 받을 때 데이터 교환을 쉽게 하기 위해 JSON을 많이 사용함

 

* 공식 미디어 타입 : application/json

확장자 : .json

 

* JSON은 length를 알 수 없는 연관배열을 표현하기에 유리하다

=> {key : value}

 

 

2. 장점

주고 받는 데이터의 타입에 제한이 없음

텍스트로 이루어져 있어 사람과 기계 간 둘 다 읽고 쓰기가 쉬움

언어나 플랫폼에 독립적이라 서로 다른 시스템 간에 객체 교환이 쉬움

자바스크립트 문법을 채용했기 때문에 eval() 함수를 이용하여 바로 사용 가능

 

 

3. 사용처

ㄱ. 구성 정보 표시

ㄴ. 통신 프로토콜 실행

 

 

3. xml vs JSON 비교

 

 xml

 JSON

 정의

 구조화된 문서를 전송 가능하게 만든 텍스트 포맷 형식

 장점

 - 태그 구조이기 때문에 작성이 간편함

 가독성이 좋음

 - DTD 등 xml 자체의 기능 확장성

 - 최소한의 정보만 가지고 있음

 => 속도 증가

 - 객체구조 {} / 배열구조 []로 효율적인 데이터 구성 가능

 - parsing이 간편함

 - 일반적인 변수처럼도 사용 가능

 단점

 - 태그 글자라 문서 양이 많아짐

 - 배열, 반복 구조인 경우 불필요한 데이터가 많이 생김

 => parsing 속도 저하

 - 내용의 의미 파악이 힘듦(함축적이라)

 - xml보다는 빠르지만 대용량 전송에는 부적함

 

* xml : Extensible Markup Language

 

 

4. 자료 표현 종류 (대표적으로 분류)

종류

표현법

객체

{Object}

배열

[Array]

변수

name(String) : value

 

 

5. 예제

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>json example</title>
</head>
<body>
    name : <span id="name"></span><br>
    age : <span id="age"></span><br>
    address : <span id="street"></span><br>
    phone : <span id="phone"></span><br>
</body>
<script type="text/javascript">
var employees = {
        "name" : "홍길동",
        "street" : "서울시 서초구 서초동",
        "age" : 33,
        "phone" : "010-1234-5678"};
        
        document.getElementById("name").innerHTML = employees.name;
        document.getElementById("age").innerHTML = employees.age;
        document.getElementById("street").innerHTML = employees.street;
        document.getElementById("phone").innerHTML = employees.phone;
</script>
</html>
cs

 

 

<JSON을 이용하여 연관 배열 데이터를 주고 받는 예제>

'Framework > Spring' 카테고리의 다른 글

파일 다운로드  (4) 2017.03.14
Ajax :: Ajax (Asynchronos JavaScript And XML)  (0) 2017.01.10
Framework :: Spring  (0) 2017.01.06
Framework :: JNDI vs JDBC(DBCP)  (0) 2017.01.02
JDBC :: 드라이버 종류  (0) 2017.01.01

+ Recent posts