JSON は、JavaScript Object Notation の略です。これは、JavaScript オブジェクトを記述するために使用されます。これは、キーと値のペアを使用してデータ値を指定するデータ共有フォーマットです。JSONオブジェクトは、すべての主要なブラウザでサポートされています。このチュートリアルでは、JavaScriptおよびJSONオブジェクトの操作に慣れている必要があります。JSONに慣れるには、当サイトの overview of the JSON data sharing format をご覧ください。また、work with JSON in JavaScript.
も確認できます。JSONフォーマットは、ネットワーク経由でデータを送信するためにも使用されます。この目的のため、データはシリアル化およびデシリアル化される必要があります。データがJSONフォーマットの場合、 stringify メソッドを使用して文字列に変換されます。操作のためにデータをオブジェクトフォーマットに戻すには、 parse メソッドが使用されます。このチュートリアルでは、次のものの使用手順について説明します： JSON.parse() および JSON.stringify()。それでは始めましょう！
JSON.parse()
このメソッドは、JSON文字列をJSONオブジェクトに変換し、プログラムで操作できるようにするために使用されます。渡される文字列は有効なJSON文字列である必要があります。そうでない場合は例外がスローされます。この文字列は、任意のWebサービスまたはリモートアプリケーションから受信できます。
このメソッドは2つのパラメータを受け取ります： 文字列 と、オブジェクトに変換する前に文字列を操作するために使用できる コールバック 関数です。アクションのステータス、メッセージ、およびステータスコードを示すメッセージをWebサービスから受信していると仮定します。以下は、文字列をオブジェクトに変換する方法の簡単な例です。
コード:
|
1 2 3 |
let json_string = '{"message":"Done with success", "status":200, "code":200}' let server_obj = JSON.parse(json_string); console.log(server_obj) |
出力:
|
1 |
{message: 'Done with success', status: 200, code: 200} |
よくある問題は、文字列の末尾にカンマが追加されることです。そのため、渡された文字列の末尾にカンマがある場合、 JSON.parse() はエラーをスローします。値を操作する必要がある場合は、2番目の引数として コールバック関数を渡すことができます。
コード:
|
1 2 3 4 5 6 7 8 9 |
let string = '{"name":"XYZ","email":"xyz@example.com"}'; let obj = JSON.parse(string, (key, value) => { if (typeof value === 'string') { return value.toUpperCase(); } return value; }); console.log(obj) |
出力:
|
1 |
{name: 'XYZ', email: 'XYZ@EXAMPLE.COM'} |
JSON.stringify()
The stringify メソッドは、 parse メソッドとまったく逆のことを行います。ここでは、JSONオブジェクトが渡され、戻り値は文字列になります。この文字列は、たとえば他のリモートWebサービスに渡され、操作のために再びJSONオブジェクトにパースされます。
コード:
|
1 2 3 |
let obj = {message:"Done with success", status:200, code:200} let str = JSON.stringify(obj); console.log(str); |
出力:
|
1 |
{"message":"Done with success","status":200,"code":200} |
stringifyメソッドは、2つの引数を取ることができます： replacerと spacer メソッドです。 replacer メソッドは、文字列内の任意の値を置換または除外するために使用できます。
コード:
|
1 2 3 4 5 6 7 8 9 |
let obj = {message:"Done with success", status:200, code:200} let str = JSON.stringify(obj, (key, value) => { if (status === 200) { return undefined; } return value; }); console.log(str) |
出力:
|
1 |
{"message":"成功しました","status":200,"code":200} |
When the spacer 引数が指定されると、配列またはオブジェクトの各要素はそれぞれの行に配置され、オブジェクトと配列の階層における深さを示すためにインデントされます。以下は、これを示す簡単なコードスニペットです。
コード:
|
1 2 3 |
let obj = {message:"成功しました", status:200, code:200} let str = JSON.stringify(obj, null, "---"); console.log(str) |
出力:
|
1 2 3 4 5 |
{ ---"message": "成功しました", ---"status": 200, ---"code": 200 } |
結論
このチュートリアルでは、JSON形式のコンテンツを扱うための2つの便利な方法を見てきました。JSONオブジェクトはいたるところに存在し、JavaScriptを使用してモダンなアプリケーションを構築する際、これらのメソッドは非常に役立ちます。詳細については、次のリンク先にあるチュートリアルをご覧ください：当ブログ:
ハッピーコンピューティング！
コメント
コメントはまだありません。最初のコメントを投稿しましょう。