JavaScript JSON
JSON は、データの保存と送信に使用される形式です。
JSON は通常、サーバーから Web ページにデータを転送するために使用されます。
JSONとは何ですか?
英語でのJSONフルネームJavaSscriptObjectNotation
JSONは軽量のデータ交換フォーマットです。
JSON は言語に依存しません *
JSON は理解しやすいです。
* JSON は JavaScript 構文を使用しますが、JSON 形式は単なるテキストです。 テキストは任意のプログラミング言語で読み取ることができ、データ形式として渡すことができます。 |
JSON の例
次の JSON 構文は、従業員オブジェクトを定義します。 3 つの従業員レコード (オブジェクト) の配列:
JSON の例
{"firstName":"John", "lastName": "Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]}
JSON は JavaScript オブジェクトとしてフォーマットされます
JSON フォーマットは、JavaScript オブジェクトを作成するコードと構文的に同じです。
これらは似ているため、JavaScript プログラムは JSON データを JavaScript オブジェクトに簡単に変換できます。
JSON 構文ルール
データはキーと値のペアです。
データはカンマで区切られます。
中括弧はオブジェクトを保持します
角括弧は配列を保持します
JSON データ - 1 つの名前が 1 つの値に対応します
JSON データは、JavaScript オブジェクトのプロパティと同様に、キーと値のペアとしてフォーマットされます。
キーと値のペアは、フィールド名 (二重引用符で囲まれた)、コロン、値で構成されます:
JSON オブジェクト
JSON オブジェクトは括弧内に大きく保存されます。
JavaScript と同様に、オブジェクトは複数のキーと値のペアを保持できます:
JSON 配列
JSON 配列は次のとおりです。角括弧内に格納されます。
JavaScript と同様に、配列にはオブジェクトを含めることができます:
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"名":"ピーター", "姓":"ジョーンズ"}
]
上記の例では、オブジェクト「employees」は配列です。 3 つのオブジェクトが含まれます。
各オブジェクトは従業員 (姓と名) の記録です。
JSON文字列をJavaScriptオブジェクトに変換します
通常、サーバーからJSONデータを読み取り、Webページにデータを表示します。
簡単にするために、Web ページに JSON 文字列を直接設定します (JSON チュートリアルを読むこともできます):
まず、文字列は JSON 形式のデータです:
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';
次に、JavaScript 組み込み関数 JSON.parse() を使用して文字列をJavaScript オブジェクト:
最後に、ページで新しい JavaScript オブジェクトを使用します:
インスタンス
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <h2>为 JSON 字符串创建对象</h2> <p id="demo"></p> <script> var text = '{"employees":[' + '{"firstName":"John","lastName":"Doe" },' + '{"firstName":"Anna","lastName":"Smith" },' + '{"firstName":"Peter","lastName":"Jones" }]}'; obj = JSON.parse(text); document.getElementById("demo").innerHTML = obj.employees[1].firstName + " " + obj.employees[1].lastName; </script> </body> </html>
インスタンスの実行»
「インスタンスの実行」をクリックします「」ボタンをクリックしてオンラインインスタンスを表示します
関連関数
関数 | 説明 |
---|---|
JSON.parse() | は、JSON文字列をJavaScriptオブジェクトに変換するために使用されます。 |
JSON.stringify() | は、JavaScriptの値をJSON文字列に変換するために使用されます。 |
JSON の詳細については、JSON チュートリアルをご覧ください。