개발자로서 현장에서 일하면서 새로 접하는 기술들이나 알게된 정보 등을 정리하기 위한 블로그입니다. 운 좋게 미국에서 큰 회사들의 프로젝트에서 컬설턴트로 일하고 있어서 새로운 기술들을 접할 기회가 많이 있습니다. 미국의 IT 프로젝트에서 사용되는 툴들에 대해 많은 분들과 정보를 공유하고 싶습니다.

솔웅

공지사항

최근에 올라온 글

최근에 달린 댓글

최근에 받은 트랙백

글 보관함

json2.js 플러그 인 알아보기

2012. 8. 4. 20:38 | Posted by 솔웅

Parsing a message in JavaScript with JSON

지난 시간에 자바스크립트에서 JSON을 어떻게 생성하는지에 대해 배웠습니다. 이제 자바스크립트에서 JSON 안의 메세지를 어떻게 parse 하는지에 대해 알아보겠습니다.

"String.parseJSON(filter)" 메소드를 이용해서 자바스크립트 내에서 JSON으로 메세지를 parse 할 수 있습니다. 이 JSON 메세지는 sting이나 객체로 parse 됩니다. filter 파라미터는 optional 입니다. filter 메세지나 결과를 transform 하는데 사용됩니다. 이 메소드는 자바스크립트의 eval()메소드를 message parse를 위해 내부적으로 사용합니다.

아래 ParseMessageJSON.htm의 전체 예제 코드가 있습니다.

ParseMessageJSON.htm


<html>

<head>

<title>Parsing Message using JSON in JavaScript</title>

<script language="javascript" src="json2.js"></script>

<script language="javascript" >

var students = {

       "Maths" : [ 

  { "Name"  : "Amit",  // First element

  "Marks" : 67,

  "age" : 23 },  

  {

 
 "Name"   : "Sandeep",  // Second element

  "Marks" : 65,

  "age" : 21 }

 ] 

 } 

// Printing Maths array values in the alert message

var i=0

var arrayObject = new Array();

for(i=0;i<students.Maths.length;i++)

{  

  arrayObject.push(students.Maths[i].Name);

  arrayObject.push(students.Maths[i].Marks);

  arrayObject.push(students.Maths[i].age);

}  

  alert("Parsing JSON Message Example ");

  alert(arrayObject.toJSONString().parseJSON());

</script>

</head>

<body>

 Parsing Message using JSON in JavaScript

</body>

</html>

이 예제를 실행시키려면 json2.js 파일이 필요합니다. 이 파일을 ParseMessageJSON.htm내에 include 해야 합니다. 이 json2.js는 creating message in JavaScript with JSON 강좌에서 사용했던 것과 같은 겁니다.

Output:

ParseMessageJSON.htm를 실행시키시면 아래와 같은 결과가 나올 겁니다.

Download Code

======== o ========= o ============ o ============= o =============

지금까지 3개의 article 을 통해서 쿠키, 탬플릿, json 관련된 플러그인 사용법을 알아봤습니다.

jQuery Mobile 샘플을 하나 분석해 보려고 봤더니 이 3개의 플러그인이 있어서 공부해 봤습니다.

아주 도움이 많이 된 것 같네요.

마지막 플러그인인 json2.js 는 이 글가지고 약간 부족할 수도 있을 것 같은데요.

네이버에서 json2.js로 검색하셔서 따로 읽어 보세요.

그럼 다음시간에는 원래 하기로 했던 jQuery Mobile 예제 파일을 분석해 보겠습니다.

저작자표시 비영리 동일조건

'jQuery Mobile > JQM codes' 카테고리의 다른 글

jQuery Mobile 로 iOS arrow button 효과 내기 (2)	2012.11.23
jQuery Mobile 샘플코드 분석, Cascading Selects - .empty() .val() - (0)	2012.08.11
jQuery Mobile 샘플코드 분석, Dynamic Add (0)	2012.08.10
jQuery Mobile 로 만든 To-Do List 분석하기 04 (0)	2012.08.09
jQuery Mobile 로 만든 To-Do List 분석하기 03 (0)	2012.08.08
jQuery Mobile 로 만든 To-Do List 분석하기 02 (0)	2012.08.07
jQuery Mobile 로 만든 To-Do List 분석하기 01 (0)	2012.08.07
jQuery.tmpl 플러그 인 튜토리얼 (0)	2012.08.04
jquery.cookie.js 사용법 알아보기 (1)	2012.08.03

IT 기술 따라잡기