마음의 안정을 찾기 위하여 - [강좌] Json(JavaScript Notation) 입문 #1
2265941
278
804
관리자새글쓰기
태그위치로그방명록
별일없다의 생각
dawnsea's me2day/2010
색상(RGB)코드 추출기(Color...
Connection Generator/2010
최승호PD, '4대강 거짓말 검...
Green Monkey**/2010
Syng의 생각
syng's me2DAY/2010
천재 작곡가 윤일상이 기획,...
엘븐킹's Digital Factory/2010
[강좌] Json(JavaScript Notation) 입문 #1
My Library | 2007/06/25 11:08
1. JSON(JavaScript Object Notation) 소개

- JSON 공식 홈페이지 (http://www.JSON.org)
- 한국어페이지 (http://www.json.org/json-ko.html)


2. JSON의 기본

기본적인 형태는 아래와 같이 사용이 가능하다.

1) 프로퍼티 <-> 값
var obj = {
   "프로퍼티 이름" : "값",
}

2) 메소드
var obj = {
   "메소드 이름" : function() {alert('This is method')}
}

3) 메소드(인수)
var obj = {
   "메소드 이름" : function(인수) {alert('This is method')}
}

이것만으로 오브젝트 obj를 만드는 것이 가능하여, obj.프로퍼티이름 으로 값을 얻어 낼 수 있어, obj.메소드이름() 으로 "This is method"라는 대화창을 표시한다.


■ 오브젝트

아래와 같이 myJSONObject를 만들어보고 이를 Javascript를 이용해 확인해보자.
<script language="JavaScript">
<!--
  var myJSONObject = {
    "test" : "hello"
  }
//-->
</script>
<form>
  <input type = "button" onclick="alert(typeof myJSONObject)" value="click">
</form>


■ 프로퍼티

<script language = "JavaScript">
<!--
  var myJSONObject2 = {
    "test": "hello"
  }
//-->
</script>
<form>
  <input type = "button" onclick = "alert( myJSONObject2 )" value = "click">
  <input type = "button" onclick = "alert( myJSONObject2.test )" value = "click">
  <input type = "button" onclick = "myJSONObject2.test = 'new test' ; alert(myJSONObject2.test )" value = "click">
</form>

1) alert(myJSONObject2)는 myJSONObject2가 object임을 보여준다.
2) alert(myJSONObject2.test)는 myJSONObject2 오브젝트에서 test프로퍼티의 값 "hello"를 가져온다.
3) myJSONObject2.test = 'new test' ;에서 test 프로퍼티의 값을 "new test"로 변경한다.
    alert(myJSONObject2.test)를 다시 수행하게되면 "hello"의 값이 "new test"로 변경되었음을 확인할 수 있다.

위의 예에서는 프로퍼티가 한개인 경우를 테스트하여 보았다. 그렇다면 프로퍼티가 2개이상일 경우에는 어떻게 사용하는지 확인해보자.

<script language="JavaScript">
<!--
  var myJSONObject3 = {
    "test1": "hello1", "test2": "hello2", "test3":"hello3"
  }
//-->
</script>

<form>
  <input type="button" onclick="alert(myJSONObject3.test1)" value="click">
  <input type="button" onclick="alert(myJSONObject3.test2)" value="click">
  <input type="button" onclick="alert(myJSONObject3.test3)" value="click">
</form>

부연 설명이 필요 없을정도로 깔끔하지 않은가?
myJSONObject3의 각 프로퍼티인 "test1", "test2", "test3"를 각각 호출하면 각 프로퍼티의 값인 "hello1", "hello2", "hello3"를 꺼내오게된다.


■ 메소드

<script language="JavaScript">
<!--
  var myJSONObject4 = {
    "test1" : "function() { alert('This is method test1') }"
  }
//-->
</script>

<form>
  <input type="button" onclick="eval('a=' + myJSONObject4.test1); a()" value="click">
</form>
※ eval()함수는 변수를 javascript의 함수처럼 쓰는 명령어임.

myJSONObject4의 메소드 test1을 실행하는 예를 보여주고 있다. 메소드 test1을 실행하면 "This is method test1"을 확인할 수 있다.


■ 메소드(인수)

마지막으로, 메소드에 인수(파라미터)가 있는 경우는 어떻게 해야하는지 살펴보도록 하자.
<script language="JavaScript">
<!--
  var myJSONObject5 = {
    "test2" : "function(arg) { alert('This is argument : ' + arg) } "
  }
//-->
</script>

<form>
  <input type="button" onclick="eval('var a=' + myJSONObject5.test2 + ''); a('hello');" value="click">
  <input type="button" onclick="eval('(' + myJSONObject5.test2+')(\'hello\')');" value="click">
</form>
</form>

1) eval('var a=' + myJSONObject5.test2 + ''); a('hello');  
2) eval('(' + myJSONObject5.test2+')(\'hello\')');

두가지 모두 동일한 결과를 보여주고 있으므로 사용하기 편한 형태를 골라 사용하면 된다.

지금까지 간단하게 JSON의 형태에 대해서 알아보았다.
다음에는 JSON의 자료형(?)에 대해 알아보도록 하겠다.
2007/06/25 11:08 2007/06/25 11:08
Article tag list Go to top
View Comment 2
Trackback URL :: 이 글에는 트랙백을 보낼 수 없습니다
From. ruddl 2007/07/05 07:17
답글달기삭제
nt 사용하면서 익스5.0 up 오류로 인해서
라이센스 없다고 함 초 암울..
자바스크립드만 다시 깔면 ..
5.0에서도 디버깅하라는 소리 안나오나요
오류는 일부로 소스볼려고 오류표시했더니
홈페이 하나 열때마다 no를 수십번식 외쳐야합니다 ㅠ,ㅠ
From. 복분자주(그리움) 2007/07/05 09:59
삭제
무슨 말씀이신지 --;;;

이해를 못하겠습니다. 죄송합니다.
PREV : [1] : NEXT
 
 
 
 
: [1] ... [14][15][16][17][18][19][20][21][22] ... [32] :
«   2024/03   »
          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 27 28 29 30
31            
전체 (1317)
출판 준비 (0)
My-Pro... (41)
사는 ... (933)
블로그... (22)
My Lib... (32)
게임 ... (23)
개발관... (3)
Smart ... (1)
Delphi (93)
C Builder (0)
Object... (0)
VC, MF... (10)
Window... (1)
Open API (3)
Visual... (0)
Java, JSP (2)
ASP.NET (0)
PHP (5)
Database (12)
리눅스 (29)
Windows (25)
Device... (1)
Embedded (1)
게임 ... (0)
Web Se... (2)
Web, S... (21)
잡다한... (6)
프로젝트 (0)
Personal (0)
대통령... (13)
Link (2)