JavaScript JSON



JSON は、データの保存と送信に使用される形式です。

JSON は通常、サーバーから Web ページにデータを転送するために使用されます。


JSONとは何ですか?

  • 英語でのJSONフルネームJavaSscriptObjectNotation

  • JSONは軽量のデータ交換フォーマットです。

  • JSON は言語に依存しません *

  • JSON は理解しやすいです。


Note* JSON は JavaScript 構文を使用しますが、JSON 形式は単なるテキストです。
テキストは任意のプログラミング言語で読み取ることができ、データ形式として渡すことができます。

JSON の例

次の JSON 構文は、従業員オブジェクトを定義します。 3 つの従業員レコード (オブジェクト) の配列:

JSON の例

{"employees":[
{"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 オブジェクトのプロパティと同様に、キーと値のペアとしてフォーマットされます。

キーと値のペアは、フィールド名 (二重引用符で囲まれた)、コロン、値で構成されます:

"firstName":"John"



JSON オブジェクト

JSON オブジェクトは括弧内に大きく保存されます。

JavaScript と同様に、オブジェクトは複数のキーと値のペアを保持できます:

{"firstName":"John", "lastName":"Doe"}



JSON 配列

JSON 配列は次のとおりです。角括弧内に格納されます。

JavaScript と同様に、配列にはオブジェクトを含めることができます:

"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"名":"ピーター", "姓":"ジョーンズ"}
]

上記の例では、オブジェクト「employees」は配列です。 3 つのオブジェクトが含まれます。

各オブジェクトは従業員 (姓と名) の記録です。


JSON文字列をJavaScriptオブジェクトに変換します

通常、サーバーからJSONデータを読み取り、Webページにデータを表示します。

簡単にするために、Web ページに JSON 文字列を直接設定します (JSON チュートリアルを読むこともできます):

まず、文字列は JSON 形式のデータです:

var text。 = '{ "従業員" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';

次に、JavaScript 組み込み関数 JSON.parse() を使用して文字列をJavaScript オブジェクト:

var obj = JSON.parse(text);

最後に、ページで新しい 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 チュートリアルをご覧ください。