JSON 이란 ?

 

JSON은 JavaScript Object Notation의 약자로,

데이터를 쉽게 교환하고, 저장하기 위해 만들어진 데이터 교환 표준이다.

JSON은 자바 스크립트 기반 표준이다.

 

XML 의 대안으로서 등장한 JSON은 사람이 읽을 수 있는 텍스트를 기반으로 한 데이터 교환 표준이라는 점에서 XML과 차이가 있다.

 

JSON은 텍스트 기반이기 때문에, 어떤 프로그래밍 언어에서도 JSON 데이터를 사용 가능하다.

 

JSON 특징

- 자바스크립트를 확장하여 제작.

- 자바스크립트 객체 표기법을 따름.

- 프로그래밍 언어와 운영체제에 독립적. (텍스트 기반이기 때문에)

- 사람과 기계가 모두 읽을 수 있도록 고안됨.

- 일반적으로 서버와 클라이언트 간 교류에서 사용됨.

 

JSON VS XML 의 차이점

 

XML은 EXtensible Markup Language의 약어로,

HTML과 비슷한 문자기반 마크업 언어입니다.

 

HTML과의 차이점이라면, 데이터를 그저 보여주는 것에서 그치는 HTML과는 달리

데이터를 저장하고 전달하는 목적으로 만들어져있습니다.

 

XML에서도 태그의 개념이 사용되는데, HTML 태그와는 달리 사용자가 정의하여 사용할 수 있습니다.

JSON과 XML의 공통점	JSON과 XML의 차이점
데이터를 저장하고 전달하기 위해 고안됨	JSON의 구문이 XML 구문보다 짧음.
기계 뿐만아니라 사람도 읽기 쉬움.	JSON 데이터가 XML 데이터보다 더 빨리 읽고 쓸 수 있음.
계층적인 데이터 구조	JSON은 배열 사용가능.(XML은 불가능)
다양한 프로그래밍 언어에 의해 파싱됨.	XML은 XML 파서로 인해 파싱되지만, JSON은 자바 스크립트 표준 함수인 eval() 함수로 파싱됨.
XMLHttpRequest 객체를 이용하여 서버로부터 데이터 전송 받을 수 있음.	JSOn은 종료 태그 사용 안함.

 

 

JSON 의 사용 범위

 

XML 문서는 XML DOM(Document Object Model)을 이용해 문서에 접근한다.

JSON은 문자열을 전송 받고 해당 문자열을 바로 파싱하기 때문에, XML보다 더 빨리 처리할 수 있다.

 

이러한 이유 때문에 빠른 응답이 필요한 웹 환경에서 사용된다.

 

그렇지만, JSON은 전송 받은 데이터의 무결성을 사용자가 직접 검증해야 해서

데이터의 검증이 필요한 경우 XML 이 사용된다.

 

 

JSON 의 형식

 

name-value 형식의 쌍(pair)

• 여러 가지 언들에서 object, hashtable, struct로 실현되었다.
• { String key : String Value} // 키 : 쌍 키에대한 값이다.

{ "firstName": "Hong", "lastName": "Gildong", "email": "gildong@gmail.com" }

 

 

값들의 순서화된 리스트 형식

• 여러 가지 언어들에서 배열(Array), 리스트(List)로 실현되었다.
• [ value1, value2, ….. ] // 배열 리스트는 [ ] 로 묶는다.

 

{ "firstName": "Hong", "lastName": "Gildong", "email": "gildong@gmail.com",

"hobby": ["puzzles","swimming"] }

 

 

---

<script type="text/javascript">
					
						    $(document).ready(function() {
									$(".btn-primarymid").on("click",function(){
										var valueMid = $(this).data("mid");
										console.log("보내주는 mID값  : " + valueMid); 
						
									var midData={ mID: valueMid }; // JSON 데이터
						
									$.ajax({
										url : "saleRankModal.do",
										type : "POST",
										data : midData,
										dataType: "json",
										success : function(result){
										console.log("로그 : 성공: "+result);
										console.log("로그 : 일로 들어온 값 : " + result.mID);
										
										var modalMid = "";
										var modalYear = "";
										var modalQuarter = "";
										var modalProduct = "";
										var modalSubs = "";
										var modalTotal="";
										
										for(var i = 0; i <result.length; i++){
											var order = result;
											var orderMid = order[i].mID;
											var orderYear = order[i].year;
											var orderQuarter = order[i].quarter;
											var orderProduct = order[i].product_price;
											var orderSubs = order[i].subs_price;
											var orderTotal = order[i].total_price;
											console.log("로그 122222222222222222 : " + order);
											console.log("로그 333333333333333333 : " + order[i].mID);
											console.log("로그 555555555555555555 : " + orderTotal);
											
											modalYear += "<p>  " + orderYear + "</p>";
											modalQuarter += "<p> " + orderQuarter + "</p>";
											modalProduct += "<p> " + orderProduct + "</p>";
											modalSubs += "<p> " + orderSubs + "</p>";
											modalTotal += "<p> " + orderTotal + "</p>";
										}
											modalMid += "<p>  " + orderMid + "</p>";
										
										$('#memberID').html(modalMid);
										$('#memberYear').html(modalYear);
										$('#memberQuarter').html(modalQuarter);
										$('#memberProduct').html(modalProduct);
										$('#memberSubs').html(modalSubs);
										$('#memberTotal').html(modalTotal);
										
										 //showModalWithData(order);
										},
										error : function(){
											console.log("로그 : 에러발생...");
										}
									});
								});
							});
					   
					</script>

 

$.ajax 설정에서 data 옵션을 midData로 지정합니다. 이것은 여러분이 만든 JavaScript 객체입니다. jQuery는 HTTP 요청 시 이 JavaScript 객체를 자동으로 JSON 형식으로 직렬화합니다.요약하면, 여러분은 JavaScript 객체(midData = 자바스크립트 내에 내가 만든 객체 )로 데이터를 서버로 보내고 있으며, jQuery가 HTTP 요청을 할 때 이를 자동으로 JSON 형식으로 직렬화합니다. 서버 측에서는 JSON 데이터를 역직렬화하여 mID 값을 가져올 수 있습니다.

 

JavaScript 객체의 JSON 직렬화란 무엇인가?

• JavaScript 객체를 JSON 형식으로 직렬화한다는 것은 JavaScript 객체의 속성 및 값을 JSON 형식으로 표현하는 것을 의미합니다. 이 과정은 JavaScript 객체를 문자열로 변환하여 JSON 데이터 형식에 부합하게 만듭니다.
• 예를 들어, JavaScript 객체를 JSON 형식으로 직렬화하면 객체의 속성과 값을 문자열로 변환하고, 객체의 계층 구조를 유지한 채 JSON 형식의 키-값 쌍으로 표현합니다.

 

JSON 형식의 문자열은 구조화된 데이터를 표현하고 다른 시스템 간에 데이터를 교환하는 데 사용되며, 파싱이 필요합니다.파싱은 JSON 문자열을 읽어서 해당 데이터를 객체나 배열로 변환하는 작업을 의미합니다. 이 작업을 통해 데이터를 구조화된 형식으로 사용할 수 있습니다.