✔ JSON 이란?
JSON은 경량화 되어있는 하나의 데이터교환 형식이다.
서로 다른 언어들간에 데이터를 주고받을 수 있도록 (보다 편리하게)만들어진 텍스트 기반의 형식이다. 우리가 잘 알고 있는 XML(eXtensible Markup Language)도 서로 다른 언어들간의 데이터 교환, 사람이 볼 수 있는 정보 표기, 쉽구 단순한 구성 등을 목표로 만들어진 데이터 교환방식 중의 하나인데 이보다 더 가볍게 만들어진 것이 JSON 표기방식이다.
- 경량의 데이터 교환 포맷이다.
- 간단한 포맷 ( 읽고 쓰기가 쉽다. )
- JSON은 텍스트 포맷이다. ( 언어에 독립적으로 프로그래밍된다. )
- XML보다 가볍고 빠르다.
- JSON 오브젝트는 XML 데이타가 타입이 없는데 비해 타입을 가진다.
- JSON types : string, number, array, boolean
- XML 데이타는 모두 String이다. - JSON은 어디에서 사용되는가? ( 통신 프로토콜을 실행한다. )
✔ JSON Object
- JSON 구조는 name/value 쌍으로 구성된다.
- 값들이 리스트는 순서가 있다. 대부분 언어들에서 array, vector, list, sequence처럼 얻어진다.
- JSON은 대부분의 지금의 언어를 통해 일반적인 데이타구조들이 지원된다.
- JSON Object 표기법
- JSON Object는 name/value 쌍의 set은 순서가 없다.
- JSON Object는 { 로 시작하고 } 로 끝난다.
- 각각의 이름은 : 와 , 로 구분된 name/value 쌍의 형식을 따른다.
- JSON Object 예제
var myJSONObject = {"bindings": [
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"},
{"ircEvent": "PRIVMSG", "method" : "deleteURI", "regex": "^delete.*},
{"ircEvent": "PRIVMSG", "method" : "randomURI", "regex": "^random.*}
]
};
1. 위의 예에서, JSON xxJavaScript 객체는 세개의 객체를 포함한 배열을 갖고있는, 각각은
"ircEvent", "method", "regex" 멤버들을 포함한하나의 멤버 "bindings"를 포함하여 생성된다.
2. 멤버들은 점(.)이나 그아래 지시자들로 회수 할 수 있다.
myJSONObject.bindings[0].method // "newURI"✔ JSON은 프로그래밍 언어가 아니다.
JSON은 이곳 저곳 어느곳에서든 사용되고 있다. 하지만 JSON은 프로그래밍 언어가 아니라 그저 단순히 데이터 표기방법 중의 하나이다. XML 보다 기능이 적고 가볍기 때문에 파싱도 빠르고 용이하며 간단한 구조로 인해 클라이언트/서버 어디서든 쉽게 사용가능하다.
✔ JSON의 구조
기본적으로 'name/value' 형태의 구조를 가지고 있다.
{object}
name(string):value
[array]
- object 는 중괄호를 이용해서 감싸고 있다. '{}'
- name은 string 으로 되어 있고 name 에 한 쌍으로 콜론 ':' 을 두고 value 가 온다.
- value는 큰따옴표안에 string, number ,true ,false , null, object ,array 이 올수 있다.
{
"member": [
{
"id": "hyunc87",
"blog": "tistory",
"from": "korea",
"memo": "HelloWorld"
},
{
"id": "abcd",
"blog": "tistory.com",
"from": "korea",
"memo": "HelloWorld2"
}
]
}
- member 라는 name에 value로 배열이 들어가 있다.
그 배열안에는 각 object가 두개 나열되어 있는데 name:value로 각각 string 값이 들어가 있다.Javascript 내에서 위의 JSON 데이터를 읽는 방법을 예제로 알아보자.
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> JSON Example </TITLE>
</HEAD>
<BODY onload="jsonParsing()">
<span id='a'> </span> <br>
<span id='b'> </span>
</BODY>
<SCRIPT type = "text/javascript">
function jsonParsing() {
var jsonText = '{"member":[{"id":"hyunc87","blog":"tistory","from":"korea","memo":"HelloWorld"},{"id":"abcd","blog":"tistory.com","from":"korea","memo":"HelloWorld2"}]}';
var o = JSON.parse(jsonText);
document.getElementById('a').innerHTML = o.member[0].id+'.'+o.member[0].blog;
document.getElementById('b').innerHTML = o.member[1].id+'.'+o.member[0].blog;
}
</SCRIPT>
</HTML>
- JSON.parse를 이용해서 텍스트를 JSON object로 변환하여 사용하였다. 결과는 다음과 같다.
hyunc87.tistory
abcd.tistory 만약, JSON object 를 다시 JSON text 로 변환하려면?
console.log(JSON.stringfy(o));
결과
member":[{"id":"hyunc87","blog":"tistory","from":"korea","memo":"HelloWorld"}, id":"abcd","blog":"tistory.com","from":"korea","memo":"HelloWorld2"}]}
✔ 파싱이란 ?
다른 형식으로 저장된 데이터를 원하는 형식의 데이터로 변환하는 것을 말한다.
■ XML, JSON : 데이터를 표현하는 문자열
■ JSON 파싱 : JSON 형식의 문자열을 객체로 변환하는 것
JSON을 자바스크립트로 파싱하기 편리하다.
JSON.parse("json문자열");하면된다.
■ 동기 : 시작해서 끝날 때까지 다른작업이 불가능
■ 비동기 : 내가 작업을하고 있는 도중에 다른 작업을 해도 된다. (예 : 스레딩)
ex) 네이버 실시간검색어가 바뀌는 것을 보면 비동기(Ajax)와 타이머를 이용하면 가능한 경우라고 한다.
한 화면인데 각각 다르게 작동 할 수 있다.
즉, Json은 JavaScript Object Notation의 약자입니다. json을 사용하는 이유는 데이터를 전송하는데 최소한에 데이터를 전송하기위함입니다. 그리고 자바스크립트만 사용하는 개념이 아니라 json은 독립적으로 다양한 언어에 사용됩니다. 이유는 사용하기 간단하고 사람이 읽기쉽습니다.
var obj = {
name : 'lee',
id : 'blog',
number : 1993
};
기본적인 자바스크립트에 객체선언 형식입니다.
이것을 JSON으로 나타낸다면
var obj_json = {
"name" : 'lee',
"id" : 'blog',
"number" : 1993
};
변수에 "를 붙이면 됩니다. JSON은 객체 변수배열을 사용하고 함수를 사용하지 않습니다.
> 참고 https://iwbtbitj.tistory.com/101
4개의 댓글
The upcoming release of 2D side-scrolling https://krnl.vip/download-super-mario-bros-wonder-nsp-xci-rom-update/. games is coming to the Nintendo Switch.
Ryujinx firmware is the best option for Nintendo Switch emulation because of its numerous features: https://ryujinxfirmware.com/
NetherSX2 apk takes client comfort to another level with its redone frontend https://nethersx2.com/
https://i-win32diskimager.com - Win32 Disk Imager is an open-source and free Windows application that allows creating ISO images on a portable drive like USB, CD, DVD, etc.
Explore the redesigned interface, featuring a user-friendly Material Design that distinguishes it from other apps, excelling in both aesthetics and performance. https://ostoratv.org/ download offers high-definition content streaming for an immersive and enjoyable viewing experience.