JSON形式の文字列をparseJSONでパースする方法

ajax

JSON形式の文字列を一度JSON(オブジェクト)に変換して、JSONとしてパースする方法を紹介します。

JSON形式の文字列と聞くと何のことだかピンとこないと思います。
ソースを見れば、ピンとくるはず。
これ以上、余計な説明はしません。さっそくソースを見てみましょう。

[スポンサーリンク]

通常のJSONをパースする方法は、こちらを参考にして下さい。
AjaxでJSON形式のデータを読み込みパースする方法

この章でやること

JSON形式の文字列をparseJSONでパースします。

今回パースするJSON(文字列)

シングルクォートで囲ってあるので、JavaScript内では文字列として扱われます。


'{"message":"success","returnCode":0}'

parseJSONでJSON形式文字列をパースするJavaScript(jQuery)

    $( function() {
        $( '#ajax-button' ) .click(
            function() {
                var jsonStr = '{"message":"success","returnCode":0}';
                var json = $.parseJSON(jsonStr);
                var str = parseJson(json);
                $('#sample-result').html(str);
            }
        );
    } );
 
    /*
    * jsonをパースする関数です。
    */
    function parseJson(json) {
        var ret = 'message : ' +  json.message + '<br/>';
        ret = ret + 'returnCode : ' +  json.returnCode;
        return ret;
    }

デモ

こちらで実際に動かすことが出来ます。

demo

解説

4行目のJSONは、シングルクォートで囲っているので、JSON形式の文字列になります。

5行目で、$.parseJSONを使って、JSON形式の文字列からJSONへ変換して、JSONとしてパースしています。

さいごに

JSON形式の文字列からJSONへ変換して、JSONとしてパースする。と日本語でみてみると一見ややこしいです。
実際にソースを見てみると、何がやりたいのか非常にシンプルに伝わると思います。

$.parseJSONは意外とよく使います。
ajaxで外部APIと通信する際、外部APIの戻り値(JSON)がよくシングルクォートで囲われています。
気付かずにパース失敗なんてことも。。。
気を付けましょう!
それでは!