テキストベースのフォーマットなので読み書きが簡単で、さらにプログラムで容易に解析できる正規構文を備えている。
基本的にはJavaScriptのサブセットであり、XML以上に構文の解析が容易。
【JSONサンプルコード】
※ employees の子要素に, “surname” : “Lacava” と “Brown” がいる。
{ "employees" : [ { "surname" : "Lacava", "name" : "Alessandro", "city" : "Milan", "age" : 30 }, { "surname" : "Brown", "name" : "John", "city" : "Rome", "age" : 35 } ] }
文字列は,「”」で囲まれたUnicode文字の集まり。
数値は,10進数のみ表記可能(整数,浮動小数点)。
参照►JSONを使ってAJAXベースのアプリケーションを高速化する
script タグの src 属性には、 呼び出し側とは異なるドメインのURLを指定することができるため、 異なるドメインに JSON によるリクエストを投げ、他のドメインで提供されている機能を直接呼び出すことが可能 となる(クロスドメイン通信が可能)。
JSONを使用するためデータ交換が軽量であることもあり、JSONPは マッシュアップを行うために適した技法の一つ として注目されている。
参照►JSONPってなに?
【サンプルコード】
※ パラメータを付加したURLを投げて、結果を取得する。
$.ajax({ type:"POST" dataType: "json", // データ形式はJSONを指定 data: { // リクエストパラメータを定義 "vq": keyword, "max-results":"10", "alt":"json-in-script" }, cache: true, // キャッシュを使用 url: "http://gdata.youtube.com/feeds/api/videos", success: function (data) { // データ取得に成功した場合の処理を定義 $("#videos").empty(); $.each(data.feed.entry, function(i,item){ // entryの各要素へアクセス var group = item.media$group; $("") // a要素を生成 .attr("href", group.media$player[0].url) //a要素のhref属性を設定 .append("") // a要素の子要素にimg要素を追加 .appendTo("#videos"); // a要素を表示領域の子要素に追加 }); }, error : function(XMLHttpRequest, textStatus, errorThrown){ // データ取得に失敗した場合の処理定義 } });