JSON 이란?

JSON 개요

JSON(제이슨 , JavaScript Object Notation) 표기법은 인간이 읽을 수 있는 데이터 교환용으로 설계된 경량 텍스트 기반 개방형 표준 포멧이다. JSON 에서 사용되는 규칙은 프로그래머들에게 잘 알려진 C, C++, Java, Python, Perl 등 수많은 프로그래밍 언어에서 쉽게 이용할 수 있다. JSON 은 JavaScript 객체 표기법을 의미한다.

json

  • 이 포맷은 Douglas Crockford 에 의해 구체화되었다.
  • 인간이 읽을 수 있는 데이터 교환을 위해 설계되었다.
  • JavaScript에서 확장되었다.
  • 파일 이름 확장자는 .json 이다.
  • JSON 인터넷 미디어 타입은 application/json 이다. = 문자 코드는 UTF-8 고정이다.

JSON 사용

  • 브라우저 확장 프로그램 또는 웹 사이트를 포함하는 JavaScript 기반 응용 프로그램을 작성할 때 사용된다.
  • JSON 형식은 네트워크 연결을 통해 구조화 된 데이터를 직렬화 및 전송하는데 사용된다.
  • 주로 서버와 Web 응용 프로그램 간에 데이터를 전송 하는데 사용된다.
  • Web 서비스와 API.s 는 공개 데이터를 제공하기 위해 JSON 형식을 사용한다.
  • 여러 프로그래밍 언어에서 사용할 수 있다.

JSON 특징

  • JSON 을 읽고 쓰는 것은 간단하다.
  • 가벼운 텍스트 기반 교환 형식이다.
  • 언어에 의존하지 않는다.

JSON 문법

  • 데이터는 속성-값 쌍으로 표현된다.
  • 중괄호는 개체를 유지하고 각각의 이름이 계속되고있는 ‘:’(콜론), 속성-값 쌍으로 쉼표로 구분된다.
  • 대괄호는 배열과 값은 쉼표로 구분 된다.

JSON 데이터 타입

타입 설명
Number JavaScript에서 배정되는 정밀한 부동 소수점 형식
String 큰 따옴표를 사용한 유니코드
Boolean true 또는 false
Array 연속된 값들의 정렬
Value string, number, true 또는 false, null 등
Object 정렬되지 않은 key:value 콜렉션
Whitespace 토큰쌍 사이에서 사용 가능
null 비었음

숫자(Number)

  • JavaScript에서 배정되는 정밀한 부동 소수점 형식이다.
  • 진수와 16 진수는 사용되지 않는다.
  • N부호 또는 무한대는 숫자로 사용되지 않는다.

아래의 표는 숫자 타입들이다.

타입 설명
정수 숫자 1-9,0 및 양수 또는 음수
분수 3, .9 같은 분수
지수 e, e+, e-,E, E+, E- 같은 지수

문법

var json-object-name = { string : number_value, .......}

예제
Number 데이터 타입의 값은 따옴표를 사용하지 않아야 한다.

var obj = {marks: 97}

문자열(String)

  • 큰 따옴표로 묶인 Unicode 문자의 순서입니다.
  • 문자는 길이 1의 문자열, 즉 단일 문자열입니다.

아래의 표는 문자열의 형식이다.

타입 설명
" 큰 따옴표
\| 역슬래쉬
\/ 슬래쉬
\b 백스페이스
\f 폼 피드(form feed)
\n 새로운 줄
\ r 리턴 키
\t 탭 키
\ u 16진수 4자리

문법

var json-object-name = { string : "string value", .......}

예제
String 데이터 타입의 값은 따옴표를 사용해야 합니다.

var obj = {name: "Amit"}

참/거짓(Boolean)

  • true 또는 false 값을 가지고 있습니다.

문법

var json-object-name = { string : true/false, .......}

예제
String 데이터 타입의 값은 따옴표를 사용해야 합니다.

var obj = {distinction: true}

배열(Array)

  • 정렬된 값의 컬렉션이다.
  • 대괄호를 둘러싸여 있으며, ‘[’ 로 시작해서 ‘]’ 로 끝난다.
  • 값은 쉼표로 구분된다.
  • 배열 인덱스는 0 으로 시작한다.
  • 키 이름이 연속하는 정수이면 배열을 사용해야 한다.

문법

[ value, .......]

예제

예제는 여러개의 오브젝트를 포함한 배열이다.

{
 "books": [{
   "language": "Java",
   "edition": "second"
 }, {
    "language": "C++",
    "lastName": "fifth"
 }, {
    "language": "C",
    "lastName": "third"
 }]
}

객체(Object)

  • 정렬되지 않은 이름과 값이 쌍(pairs)으로 이루어진 세트입니다.
  • 오브젝트는 중괄호로 둘러싸여 있으며, ‘{’ 로 시작해서 ‘}’ 로 끝난다.
  • 각각의 이름은 ‘:’(콜론) 그리고 ‘,’(쉼표) 로 구분된 속성-값 쌍으로 되어 있다.
  • 키는 문자열이어야 하며, 서로 달라야 한다.
  • 오브젝트들은 키는 문자열이어야 한다.

문법

{ string : value, .......}

예제

예제는 1개의 오브젝트를 나타낸다.

{
 "id": "011A",
 "language": "JAVA",
 "price": 500
}

Null

이것은 비어있는 타입을 의미합니다.

예제

var i = null;

간단한 오브젝트 만들기

JSON 객체(Object)는 JavaScript를 사용하여 만들 수 있다.

빈 객체 만들기

var obj = {};

새 객체 만들기

var obj = new Object();

속성을 갖는 오브젝트를 생성

아래 코드는 string타입 bookname 와 숫자타입 price 를 속성을 갖는 오브젝트를 생성한다.
속성은 점(.) 연산자를 통해 접근가능하다.

var obj = { "bookname ":"VB BLACK BOOK", "price":500 };

간단한 JSON 예제

예제 1) 아래 JSON는 책 정보를 표현한 것이다.

{
 "book": [{
    "id": "01",
   "language": "Java",
   "edition": "third",
   "author": "Herbert Schildt"
 }, {
    "id": "07",
   "language": "C++",
    "edition": "second",
    "author": "E.Balagurusamy"
  }]
}

예제 2) JSON을 사용하여 JavaScript에서 객체를 생성하기
아래의 코드를 json_object.html 로 저장한다.

<html>
<head>
<title>Creating Object JSON with JavaScript</title>
<script language="javascript">
 var JSONObj = {
   "name" : "tutorialspoint.com",
    "year" : 2005
 };
  document.write("<h1>JSON with JavaScript example</h1>");
  document.write("<br>");
 document.write("<h3>Website Name=" + JSONObj.name + "</h3>");
 document.write("<h3>Year=" + JSONObj.year + "</h3>");
</script>
</head>
<body>
</body>
</html>

Javascript의 실행을 지원하는 브라우저를 사용하여 json_object.html 열면, 다음과 같은 결과가 표시된다.

Json Object

**예제 3) JSON을 사용하여 JavaScript에서 Array 객체 만들기
아래의 코드를 json_array_object.htm 로 저장한다.

<html>
<head>
<title>Creation of array object in javascript using JSON</title>
<script language="javascript">
  document.writeln("<h2>JSON array object</h2>");
 var books = {
   "Pascal" : [ {
      "Name" : "Pascal Made Simple",
      "price" : 700
   }, {
      "Name" : "Guide to Pascal",
     "price" : 400
   } ],
    "Scala" : [ {
     "Name" : "Scala for the Impatient",
     "price" : 1000
    }, {
      "Name" : "Scala in Depth",
      "price" : 1300
    } ]
 }
 var i = 0
 document.writeln("<table border='2'><tr>");
 for (i = 0; i < books.Pascal.length; i++) {
   document.writeln("<td>");
   document.writeln("<table border='1' width=100 >");
    document.writeln("<tr><td><b>Name</b></td><td width=50>" + books.Pascal[i].Name + "</td></tr>");
    document.writeln("<tr><td><b>Price</b></td><td width=50>" + books.Pascal[i].price + "</td></tr>");
    document.writeln("</table>");
   document.writeln("</td>");
  }
 for (i = 0; i < books.Scala.length; i++) {
    document.writeln("<td>");
   document.writeln("<table border='1' width=100 >");
    document.writeln("<tr><td><b>Name</b></td><td width=50>"  + books.Scala[i].Name + "</td></tr>");
    document.writeln("<tr><td><b>Price</b></td><td width=50>" + books.Scala[i].price + "</td></tr>");
   document.writeln("</table>");
   document.writeln("</td>");
  }
 document.writeln("</tr></table>");
</script>
</head>
<body>
</body>
</html>

Javascript의 실행을 지원하는 브라우저를 사용하여 json_object.html 열면, 다음과 같은 결과가 표시된다. Json result

참조