JSON Text를 JSON Object로 변환하기

JSON 은 써보면 써볼수록 유용한 것 같다. 간결하고 편하고 직관적이다. 어쨌든 JSON Text를 Object로 변환해야 할 때가 있다. 여기서 JSON Text라는 것은 형태는 JSON의 형태이지만 자바스크립트에서 이걸 Object가 아닌 그냥 텍스트로만 인식하고 있다는 것이다. 이걸 Object로 바꾸어야만 그안의 값을 불러다가 사용할 수 있다.

가장 흔한 예가 Ajax를 사용할 경우이다. Ajax로 호출을 하고 결과값으로 받은 req.responseText로 JSON을 받았을 경우에는 그냥 Text이기 때문에 Object로 변환해 주어야 한다.

{ id:'Outsider', sex:'male' }

Ajax에서 리턴받을 JSON의 형태가 위와 같이 되어 있을 경우에는


위의 코드처럼 eval을 해주면 JSON 오브젝트로 변환할 수 있다.

[ { id:'Outsider', sex:'male' },
  { id:'Zziuni', sex:'male' } ]

JSON이 위의 형태처럼 배열로 되어 있을 경우에는


그냥 eval을 해주면 JSON 오브젝트로 변환할 수 있다.

다만 이렇게 변환할 경우 eval()은 빠르기는 하지만 단순히 그안의 스트링을 그대로 실행시켜 주는 것이기 때문에 리턴값으로 자바스크립트 명령문이 온다면 그대로 실행시켜버리기 때문에 보안이슈가 발생할 수 있다. 

이렇게 리턴받은 소스를 신뢰하기 어려울 때는 JSON.org 에서 제공하는 JSON parser을 사용해야 한다. JSON parser는 오직 JSON text만 받아들이고 다른 스크립트는 거부하고 eval()만큼이나 빠르다.


JSON.parse()의 목적대로 JSON 텍스트 외에는 거부해야하기 때문에 JSON문법을 정확히 지켜주지 않으면 SyntaxError 예외가 던져진다. 그렇기 때문에 키와 값을 모두 쌍따옴표(")로 묶어주는 문법을 정확하게 지켜주어야 한다. 아래처럼....

{ "id":"outsider", "sex":"male" }

여기서 JSON.parse()를 사용하기 위해서는 Douglas Crockford 가 만든 json2.js 가 필요하다. json2.js는 더글라스 크록포드가 JSON의 편리한 사용을 위해 만든 JSON API의 새버전이다.(그래서 2가 붙어있다.) 이 API에는 2개의 메서드가 들어있는데 JSON.stringify()와 JSON.parse()이다. JSON.stringify()는 JSON.parse()와는 완전히 반대로 JSON 객체를 주면 JSON 텍스트로 만들어서 준다. 필요할때 갖다 쓰면 된다. (John Resig 이 이전버전보다 새버전의 API가 훨씬 좋다고 꼭 이걸 쓰란다.)
크리에이티브 커먼즈 라이센스
Creative Commons License
2008/12/21 03:29 2008/12/21 03:29

Trackback URL : http://blog.outsider.ne.kr/trackback/257

Comments List

  1. 좋은 자료 얻어 갑니다.
    제 블로그에 참고 해서 간단하게 공부하면서 글을 올렸습니다.
    조심히 사용할려고 했는데 문제가 있다면 말씀 부탁드리겠습니다.
    그럼 좋은 자료 감사하고 좋은 한주 되세요.

    1. CCL상에서 포스팅되고 있고요. 동일조건은 크게 따지진 않는 편입니다. 가보니 딱히 제포스팅글을 가져갔다는 느낌도 전혀 없으신데요. ^^
      도움되셨다니 저도 기분이 좋네요.
      블로그 가보니 좋은 정보가 많아서 종종 찾아뵙겠습니다.

  2. 반대로 JSON Object를 JSON Text로 변환할 수 있는 방법이 있는지 궁금합니다.

    1. 그냥 단순히 +"" 를 이어붙히거나 toString()을 하면 타입을 스트링으로 바꿀 수 있기는 하더군요.
      테스트해보았습니다만 원래 String을 준거랑은 좀 다르게 동작을 합니다.
      prototype.js를 쓰시면 Object.toJSON(JSON객체) 를 하시면 스트링으로 떨어집니다.
      prototype.js 소스를 보니 객체에서 루프돌면서 이름과 값을 꺼내와서 배열로 이어붙힌뒤에 join으로 스트링만들어서 리턴하는군요. 해당부분 소스 참고하시면 될듯 합니다.

  3. 아 정말 도움이 됩니다 ㅠ_ㅠ 방금 발견했는데 5년동안 변비하다가 한번에 뚫는 기분 하하하..

    1. 그렇게 많이 도움이 되셨다니 저도 좋군요. ^^

Leave a Reply

[로그인][오픈아이디란?]
  • Categories

    List (497)
    BlaBlaBla~ (89)
    JAVA (82)
    Scala (16)
    .NET (21)
    PHP (1)
    Database (21)
    Web Development (54)
    Publishing (25)
    Javascript (105)
    Ruby on Rails (11)
    RIA (10)
    Web 2.0 & Semantic (44)
    Ubuntu (4)
    Mobile (14)
  • Tag Cloud

  • Calendar

    «   2010/09   »
          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    
  • Archives

  • SAVE THE
    DEVELOPERS <!>
    Upgrade IE 6 Now!
  • Recent Posts

  • Recent Comments

  • Recent Trackbacks

  • Recent My Delicious

  • Site Stats

    • Total hits: 696258
    • Today: 198
    • Yesterday: 1149
  • 1356

    1031

    0

    -30 days

    today : 198

    Powered by  MyPagerank.Net