JSON 簡介

JSON: JavaScript Object Notation(JavaScript オブジェクト記法)。

JSONはデータの保存および交換のための構文です。

JSONはJavaScriptオブジェクト記法で書かれたテキストです。

データの交換

ブラウザとサーバー間でデータが交換される場合、データはテキスト形式でなければなりません。

JSONはテキストであり、どんなJavaScriptオブジェクトもJSONに変換して、それをサーバーに送信することができます。

サーバーから受信したJSONデータをJavaScriptオブジェクトに変換することもできます。

このようにして、データをJavaScriptオブジェクトとして処理し、複雑な解析や変換を必要としなくても済みます。

データの送信

データがJavaScriptオブジェクトとして保存されている場合、そのオブジェクトをJSONに変換して、それをサーバーに送信することができます。

var myObj = { name:"Bill Gates",  age:62, city:"Seattle" };
var myJSON =  JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;

自分で試してみてください

このチュートリアルの後の章でさらに詳しく学ぶことができます JSON.stringify() 関数の知識。

データの受信

JSON形式でデータを受け取った場合、それをJavaScriptオブジェクトに変換することができます:

var myJSON = '{ "name":"Bill Gates",  "age":62, "city":"Seattle" }';
var myObj =  JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;

自分で試してみてください

このチュートリアルの後の章でさらに詳しく学ぶことができます JSON.parse() 関数の知識。

データの保存

データを保存する際には、データのフォーマットが特定のものになければなりませんし、どこに保存するかに関わらず、テキストが有効なフォーマットの1つです。

JSONにより、JavaScriptオブジェクトをテキストとして保存することが可能です。

データをローカルストレージに保存します

//データの保存:
myObj = { name:"Bill Gates",  age:62, city:"Seattle" };
myJSON =  JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);
//データの受信:
text = localStorage.getItem("testJSON");
obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;

自分で試してみてください

何が JSON ですか?

  • JSON は JavaScript オブジェクト記法(JavaScript Object Notation)
  • JSON は軽量なデータ交換フォーマットです
  • JSON は自己説明性があり、理解しやすいです
  • JSON は言語に依存しません*

*

JSON は JavaScript グラフィックスを使用していますが、JSON フォーマットは純テキストです。

テキストは、どんなプログラミング言語でもデータとして読み取り、使用できます。

JSON フォーマットは最初に Douglas Crockford によって提案されました。

なぜ JSON を使用するべきですか?

JSON フォーマットはテキストに過ぎず、サーバーとブラウザ間で簡単に転送でき、どんなプログラミング言語でもデータフォーマットとして使用できます。

JavaScript は、JSON フォーマットで書かれた文字列をネイティブな JavaScript オブジェクトに変換するための内蔵関数を提供します:

JSON.parse()

したがって、あなたがサーバーから JSON フォーマットでデータを受け取った場合、あなたはそれを他の JavaScript オブジェクトのように使用できます。