JSON は、主に、あるサーバーまたはシステムから別のサーバーまたはシステムにデータを保存および転送するために使用される軽量のデータ統合形式です。一方、マップにもデータが格納され、キーが任意のデータ型を持つことができるキー値形式が使用されます。開発者は、対応するキーを選択することで特定のデータを取得できます。
この記事では、次のセクションを取り上げて、JavaScript で JSON をマップに変換する、またはマップから JSON を変換するプロセスについて説明します。
- JavaScript で JSON データをマップに変換するにはどうすればよいですか?
- JavaScript でマップから JSON データを変換するにはどうすればよいですか?
- JSON APIを取得してそのデータをマップに変換する方法
JavaScript で JSON データをマップに変換するにはどうすればよいですか?
JSON データをマップに変換すると、キーと値のペアの形式が次のように保持されます。 '地図' また、JSON と同様にキーと値の形式でデータを保存します。したがって、開発者は、JavaScript オブジェクト変換では保証されていないキーの元の順序を維持できます。変換中 「JSON」 データを '地図' 柔軟性が向上し、開発者は Map 組み込みメソッドを使用してデータを簡単に検索できるようになります。
JSON ハードコーディングされたデータがマップに変換される以下のコード ブロックにアクセスしてみましょう。
< スクリプトの種類 = 「テキスト/JavaScript」 >
定数 json形式 = '{'著者1':'ジャクソン','著者2':'リード','著者3':'ターシャ','著者4':'ペターソン'} ' ;
定数 マップ形式 = 新しい 地図 ( 物体 。 エントリ ( JSON。 解析する ( json形式 ) ) ) ;
コンソール。 ログ ( マップ形式 ) ;
脚本 >
上記のコードの説明は次のようになります。
- まず、const 型変数を作成します。 「jsonフォーマット」 JSON 形式、つまりキーと値の形式のデータが含まれています。
- 次に、次の名前でマップの新しいインスタンスを作成します。 「マップフォーマット」 。 JSON データを解析するには、 「マップフォーマット」 の中で 「JSON.parse()」 方法。
- 次に、このメソッドによって返された結果を 「Object.entries()」 配列の配列を作成し、それぞれの内部配列がキーと値のペアを表します。
- 最終結果またはこれらすべてのメソッドを、内部の適切な配置に沿って渡します。 '地図' コンストラクタ。さて、そのインスタンス 「マップフォーマット」 変換された JSON データが含まれており、これを使用してコンソール ウィンドウに表示されます。 「console.log()」 方法。
上記のコードをコンパイルすると、コンソール ウィンドウは次のようになります。
出力により、JSON データが Map に変換されたことが確認されます。 JSON データを配列またはマップに変換するための詳細情報と例については、他のリンクを参照してください。 記事 。
JavaScript でマップから JSON データを変換するにはどうすればよいですか?
データを JSON 形式に変換すると、その有効期間中の可用性が向上し、データを失うことなくこのデータをネットワーク上のどこにでも送信できるようになります。さらに、JSON 形式は人間が容易に判読できるため、Web API や構成ファイルで使用できます。以下のプログラムでは、Map データを JSON 形式に変換します。
< スクリプトの種類 = 「テキスト/JavaScript」 >定数 マップ形式 = 新しい 地図 ( [
[ '著者1' 、 「ジャクソン」 ] 、
[ '著者2' 、 「リード」 ] 、
[ '著者3' 、 「ターシャ」 】 、
[ '著者4' 、 「ピーターソン」 ] 、
】 ) ;
定数 json形式 = JSON。 文字列化する ( 物体 。 fromエントリ ( マップ形式 ） ) ;
コンソール。 ログ ( json形式 ） ;
脚本 >
上記のコードブロックの説明は次のようになります。
- まず、名前付きのインスタンス 「マップフォーマット」 は、複数のエントリを含むマップに対して作成されます。
- 次に、 「Object.fromEntries()」 方法が利用されており、 「マップフォーマット」 それに渡されます。これにより、提供された Map データがネストされた配列に変換されます。
- 次に、ネストされた配列が 「JSON.stringify()」 メソッドを使用して、キーと値のペアの位置合わせを維持しながら、ネストされた配列を JSON 形式に変換します。
- 最終的に、生成された JSON 形式のデータがコンソール ウィンドウに表示されます。
上記のコードのコンパイル後に生成される出力を以下に示します。
出力は、Map データが JSON 形式に正常に変換されたことを示しています。
JSON APIを取得してそのデータをマップに変換するにはどうすればよいですか?
API から受け取った JSON データは、最初のセクションで説明したのと同じアプローチを利用して直接 Map に変換することもできます。これを行うには、次に示すように、最初に API をフェッチし、次にフェッチした JSON データをマップに変換する必要があります。
< 脚本 >非同期 関数 変換JSONApi ( ） {
試す {
定数 レス = フェッチを待つ ( 'https://jsonplaceholder.typicode.com/todos/' ） ;
定数 json形式 = 解決を待ちます。 json ( ） ;
定数 マップ形式 = 新しい 地図 ( 物体 。 エントリ ( json形式 ) ） ;
コンソール。 ログ ( マップ形式 ） ;
} キャッチ ( 原因エラー ) {
コンソール。 エラー ( 「データの取得または変換中にエラーが発生しました:」 、 原因エラー ） ;
}
}
変換JSONApi ( ） ;
脚本 >
上記のコードの説明は次のとおりです。
- まず、という名前の非同期関数 「convertJSONApi()」 関数の背後にあるキーワード「async」を利用して定義されています 'キーワード' 。
- 次に、 '試す' ブロックして作成する 「定数」 型変数 「レス」 API から取得したデータを保存します。取得は、API リンクを 'フェッチ（）' 方法。また、 '待つ' この裏にあるキーワード 'フェッチ（）' すべての API データの到着を待つメソッド。
- 次に、 「json()」 「res」変数のメソッドを使用して、受信またはフェッチされたすべてのデータを読み取ります。の '待つ' その後ろにもキーワードが適用され、データの読み取りが完了するのを待ちます。という名前の変数に結果を渡します 「jsonフォーマット」 。
- その後、 「jsonフォーマット」 という名前のメソッド内に渡されます 「Object.entries()」 提供されたデータのネストされた配列を作成します。これは次に内部に渡されます '地図（）' コンストラクターを使用して配列を Map に変換し、 '地図' という名前のインスタンス 「マップフォーマット」 。
- この取得された JSON API は Map に変換され、コンソールに表示されます。 「マップフォーマット」 内部の変数 「console.log()」 方法。
- プロセス全体で発生したエラーを捕捉するには、 'キャッチ' ブロックして、発生したエラーを含むダミー パラメータを渡すと、それを処理するためにダミー メッセージが表示されます。
上記のコードの完了後の出力を以下に示します。
出力には、提供された API から JSON 形式のデータが取得され、このデータがマップに変換されたことが示されています。
JavaScript で JSON を Map に変換し、Map を JSON に変換するプロセスについて学習しました。
結論
JSON データを Map に変換するには、次のようなメソッドを使用します。 「JSON.parse()」 そして 「Object.entries()」 使用されています。最初のものは JSON データを解析し、2 つ目は解析されたデータのネストされた配列を作成します。 MapデータをJSON形式に変換する場合、 「Object.fromEntries()」 そして 「JSON.stringify()」 データをネストされた配列に変換し、JSON 形式に変換するメソッドがそれぞれ使用されます。このブログでは、JavaScript で JSON と Map を相互に変換する手順を説明しました。