js が JSON コードをフォーマットする方法

著者：Eve Cole 更新時間：2024-12-15 09:12:01

Downcodes のエディターでは、JavaScript での JSON データのフォーマット方法について詳しく説明しています。この記事では、JSON.stringify() と JSON.parse() の 2 つのコアメソッドをコード例と組み合わせて詳しく掘り下げ、それらを使用して JSON コードを美しく処理する方法、およびその際の注意事項を詳しく説明します。複雑なデータ構造を扱う。初心者でも経験豊富な開発者でも、この記事から多くの利益を得て、JSON データ処理の理解と応用能力を向上させることができます。

JavaScript では、JSON コードのフォーマットは主に、JSON.stringify() と JSON.parse() という 2 つのコアメソッドに依存します。 JSON.stringify() は JavaScript オブジェクトを JSON 文字列に変換する役割を果たし、JSON.parse() は JSON 文字列をネイティブ JavaScript オブジェクトに解析します。これら 2 つの方法は、JSON データを処理するときに非常に便利です。具体的には、JSON.stringify() メソッドはオブジェクトを JSON 文字列に変換するだけでなく、置換関数とスペースの数という 2 つの追加パラメータも受け入れるため、ニーズに応じて出力形式をカスタマイズできます。 JSONの美化。さらに、この方法により、開発者はデータをより柔軟に処理して、さまざまな環境で最適に表示できるようになります。

1. JSON.STRINGIFY() メソッドの使用

JSON.stringify() は、JSON データ形式を処理するときに最も一般的に使用されるメソッドの 1 つです。 JavaScript オブジェクトを JSON 文字列に変換できます。これは、データをサーバーに送信したり、LocalStorage からデータを保存したり読み取ったりするときに役立ちます。

基本的な使い方:

let obj = { 名前: ジョン、年齢: 30 };

let jsonString = JSON.stringify(obj);

console.log(jsonString); // 出力: {名前:ジョン,年齢:30}

フォーマットされた出力:

JSON.stringify() メソッドは、結果の文字列のインデントを制御するために使用される 3 番目のパラメーターを受け入れます。数値の場合は、インデントの各レベルのスペースの数を表し、文字列 (最大 10 文字) の場合は、その文字列がインデント文字として使用されます。

let obj = { 名前: ジョン、年齢: 30 };

let prettyJsonString = JSON.stringify(obj, null, 4);

console.log(prettyJsonString);

出力：

{

名前：ジョン、

年齢: 30歳

}

2. JSON.PARSE() メソッドの使用

既存の JSON 文字列の場合、これらのデータを JavaScript で処理する必要がある場合、JSON.parse() メソッドが特に重要です。 JSON 文字列を JavaScript オブジェクトに変換できるため、プログラムがこれらのデータに対してさらに操作を実行しやすくなります。

基本的な使い方:

let jsonString = '{名前:ジョン、年齢:30}';

let obj = JSON.parse(jsonString);

console.log(obj); // 出力: { 名前: 'ジョン'、年齢: 30 }

解析中のデータの処理:

JSON.parse() はオプションの 2 番目のパラメーターである関数もサポートしており、これにより解析された属性値を操作できるようになります。

let jsonString = '{名前:ジョン、年齢:30}';

let obj = JSON.parse(jsonString, (key, value) => {

if (key === age) return parseInt(value);

戻り値;

});

console.log(obj); // 出力: { 名前: 'ジョン'、年齢: 30 }

3. JSON METHODS を使用して複雑なデータ構造を処理する

より複雑なデータ構造を扱う場合、JSON.stringify() と JSON.parse() の変換機能を合理的に利用することが特に重要です。たとえば、日付オブジェクトや関数を含むオブジェクトが存在する場合、直接変換すると情報が失われたり、オブジェクトを正しく復元できない可能性があります。

日付オブジェクトを処理します。

let obj = { イベント: カンファレンス、日付: new Date() };

let jsonString = JSON.stringify(obj);

let newObj = JSON.parse(jsonString, (key, value) => {

if (key === date) 新しい Date(value) を返します。

戻り値;

});

console.log(newObj); // 出力では日付属性が日付型として保持されます。

特別なオブジェクトを処理します。

関数や循環参照を含むオブジェクトなどの複雑なオブジェクトは、JSON 変換プロセス中に特別な注意が必要です。このため、開発者はシリアル化と逆シリアル化の詳細を正確に制御して、データの整合性と正確性を確保する必要があります。

4. 実践的な提案

JSON.stringify() を使用してフォーマットする場合、置換関数を定義して、不要な属性を削除したり、特定のシリアル化のニーズに合わせて値を変換したりできます。インデントパラメーターを使用すると、読みやすい JSON 文字列を生成できます。これは、プロセスをデバッグしたり、ユーザーにデータを直接表示したりするのに非常に役立ちます。複雑なデータ構造または特殊なオブジェクトを扱う場合、JSON.parse() の回復関数を合理的に使用して解析プロセスをカスタマイズすることは、情報損失とエラー回復を回避するための重要な手段です。

上記の紹介を通じて、JavaScript で JSON データの書式設定を処理する際の JSON.stringify() と JSON.parse() の重要性と実用性がわかります。単純なデータ交換であっても、複雑なデータ構造の処理であっても、これら 2 つの方法を適切に使用することで、開発効率とデータ管理性を大幅に向上させることができます。

js が JSON コードをフォーマットする方法

1. JSON.STRINGIFY() メソッドの使用

2. JSON.PARSE() メソッドの使用

3. JSON METHODS を使用して複雑なデータ構造を処理する

4. 実践的な提案

関連する FAQ: