JavaScriptのクロスブラウザーJSONシリアル化

この記事では、オブジェクトのシリアル化、現在のブラウザの実装の利点を検討し、AJAXベースのプロジェクトに役立ついくつかのコードを開発します。 リテラル表記を使用して定義されたかなり複雑なJavaScriptオブジェクトがあると仮定します。

var obj1 = {
    b1: true,
    s1: "text string",
    n1: 12345,
    n2: null,
    n3: undefined,
    a1: [ 1,1,2,3,5,8, [13, 21, 34] ],
    o1: {
        a: [3, 2, 1],
        b: {
            c: 42,
            d: [ 3.14, 1.618 ]
        }
    }
};

さまざまな方法でオブジェクトプロパティにアクセスできます。

obj1.s1;                // returns "text string"
obj1["n1"];             // returns 12345
obj1.a1[6][1];          // returns 21
obj1["o1"]["b"]["c"];   // returns 42

このオブジェクトは、個々の引数を指定するのではなく、JavaScript関数とメソッドに渡すこともできます。便利なもの。 ただし、このオブジェクトをCookieに保存する必要がある場合はどうなりますか？ AJAXリクエストを介してオブジェクトをWebサービスに渡す必要がある場合はどうなりますか？そのWebサービスがオブジェクトの変更されたバージョンを返したい場合はどうなりますか？答えはシリアル化です：

• シリアル化は、オブジェクトを文字列に変えるプロセスです。
searializationはその文字列をネイティブオブジェクトに戻します。
おそらく、JavaScriptで使用できる最高の文字列表記は、JSON - JavaScriptオブジェクト表記です。 JSONは、上記のようにJavaScriptオブジェクトリテラル表記に触発された軽量のデータインターチェンジ形式です。 JSONは、PHPおよび他の多くのサーバー側言語でサポートされています（json.orgを参照）。 JavaScriptには2つのJSONメソッドがあります。

json.stringify（
1. obj） - javaScriptオブジェクトをjson文字列に変換します
json.parse（
2. str） - json文字列をJavaScriptオブジェクトに戻します
残念ながら、これらの方法を提供するブラウザはほとんどありません。現在までに、Firefox 3.5、Internet Explorer 8.0、Chrome 3ベータのみがネイティブサポートを提供します。一部のJavaScriptライブラリは独自のJSONツールを提供しています（Yuiなど ）しかし、多くは（jqueryを含む）。 ただし、すべてが失われていません。JavaScriptは柔軟性があり、ブラウザがそれらを必要とするたびにJSON Stringifyと解析方法を実装できます。 コードの上部では、ネイティブJSONオブジェクトまたは空のオブジェクトを使用できない場合は、JSON変数を作成します。

json.stringifyコードはもう少し複雑です：

var JSON = JSON || {};

JSON.Stringifyが使用できない場合、単一のOBJパラメーターを受け入れる新しい関数を定義します。パラメーターは、上記のOBJ1などの単一の値、配列、または複雑なオブジェクトにすることができます。 コードはオブジェクトタイプを調べます。単一の値はすぐに返され、文字列のみが変更され、値が引用符を付けられます。 配列またはオブジェクトが渡された場合、コードはすべてのプロパティを繰り返します。

// implement JSON.stringify serialization
JSON.stringify = JSON.stringify || function (obj) {

    var t = typeof (obj);
    if (t != "object" || obj === null) {

        // simple data type
        if (t == "string") obj = '"'+obj+'"';
        return String(obj);

    }
    else {

        // recurse array or object
        var n, v, json = [], arr = (obj && obj.constructor == Array);

        for (n in obj) {
            v = obj[n]; t = typeof(v);

            if (t == "string") v = '"'+v+'"';
            else if (t == "object" && v !== null) v = JSON.stringify(v);

            json.push((arr ? "" : '"' + n + '":') + String(v));
        }

        return (arr ? "[" : "{") + String(json) + (arr ? "]" : "}");
    }
};

文字列値には引用符が追加されています
1. 子の配列またはオブジェクトは、json.stringify関数に再帰的に渡されます。
結果の値は、j​​son []配列の最後に「name：value」文字列、または配列項目の単一値として追加されます。
2. 最後に、JSONアレイはコンマ削除リストに変換され、配列[]またはオブジェクト{}内で返されます必要に応じてブラケット。

あなたの脳が痛むなら、あなたはjson.parseコードがはるかに単純であることを知って喜んでいるでしょう：

var obj1 = {
    b1: true,
    s1: "text string",
    n1: 12345,
    n2: null,
    n3: undefined,
    a1: [ 1,1,2,3,5,8, [13, 21, 34] ],
    o1: {
        a: [3, 2, 1],
        b: {
            c: 42,
            d: [ 3.14, 1.618 ]
        }
    }
};

これにより、JSON文字列がeval（）を使用してオブジェクトに変換されます。 すべてのプロジェクトでJSONシリアル化関数を実装するために急いで行く前に、いくつかのゴッチャスがあります。

• このコードは意図的に短く保たれています。ほとんどの状況では機能しますが、ネイティブjson.stringifyとjson.parseメソッドには微妙な違いがあります。 すべてのJavaScriptオブジェクトがサポートされているわけではありません。たとえば、日付（）は空のオブジェクトを返しますが、ネイティブJSONメソッドはそれを日付/時刻文字列にエンコードします。
コードは関数をシリアル化します。 var obj1 = {myfunc：function（x）{}};一方、ネイティブのJSONメソッドは
• ではありません
非常に大きなオブジェクトは再帰エラーをスローします。
json.parseでのeval（）の使用は本質的に危険です。独自のWebサービスを呼び出している場合は問題にはなりませんが、サードパーティのアプリケーションへの呼び出しは、誤ってまたは意図的にページを破り、セキュリティの問題を引き起こす可能性があります。必要に応じて、json.orgからより安全な（しかしより長く遅い）JavaScriptパーサーが入手できます。
• コードが便利であることを願っています。自分のプロジェクトで自由に使用してください。 リソースファイル：
• jsonシリアル化デモンストレーションページ

完全なJavaScriptコード（json-serialization.js）

• zipファイルに完全なコードをダウンロード
• 関連する読書：
• jQueryプラグインの開発方法

自動拡張Textarea jqueryプラグインを構築する方法

• すぐに来る：JSONシリアル化の有用なアプリケーション…
• JavaScript JSON Serializationについてよく尋ねられる質問
JavaScriptのJSONシリアル化とは

JavaScriptのJSONシリアル化は、JavaScriptオブジェクトをJSON文字列形式に変換するプロセスです。これは、json.stringify（）メソッドを使用して行われます。結果のJSON文字列は、サーバーに保存または送信できます。クライアントとサーバー間でデータを簡単に転送できるようにするため、Web開発における重要なプロセスです。簡単な例は次のとおりです。OBJ= {name： "john"、 "john"、 "age：30、city：" new York "};let myjson = json.stringify（obj）;console.log（myjson）;

この例では、Javascript object 'obj int inted inted inted int int int int inted inted inted inted inted inted object' obsip 「myjson」。

javascriptで配列をシリアル化できますか？

はい、json.stringify（）メソッドを使用してjavascriptの配列をシリアル化できます。この方法は、単純な配列だけでなく、オブジェクトの配列でも機能します。例は次のとおりです。

let arr = [1、2、3、4];

let myjson = json.stringify（arr）;

console.log（myjson）;
この例では、array 'arr」はjson stringに変換されます。

javascriptのjson文字列を脱また重化するにはどうすればよいですか？

脱介入は、JSON文字列をJavaScriptオブジェクトに戻すプロセスです。これは、json.parse（）メソッドを使用して行われます。例は次のとおりです。

let myjson = '{"name"： "john"、 "age"：30、 "city"： "new York"}';
let obj = json.parse（myjson）;
console.log（obj）;
json.parse（）。

javascriptの関数をシリアル化しようとするとどうなりますか？

json.stringify（）を使用してjavascriptの関数をシリアル化しようとすると、関数は無視され、結果のJSON文字列に表示されません。これは、JSONがデータ形式であり、JavaScriptの実行能力をサポートしていないためです。これにより、シリアル化プロセス中に値をフィルタストしたり、変更したりすることができます。これは、インデントに使用するスペースの数を表すJSON.Stringify（）の3番目の引数として数字を提供することによって行われます。デフォルトでは、JavaScriptの日付オブジェクトをシリアル化すると、ISO形式の文字列に変換されます。それを脱上するとき、それは自動的に日付オブジェクトに戻されません。 new date（）constructorを使用して手動で変換する必要があります。オブジェクトにtojson（）メソッドがある場合、json.stringify（）が呼び出し、元のオブジェクトの代わりに返される値をシリアル化します。 JavaScriptは最大2^53 - 1までの数値を正確に表すことができます。より多くの数値をシリアル化する必要がある場合は、正確な損失を避けるために最初に文字列に変換する必要があるかもしれません。

以上がJavaScriptのクロスブラウザーJSONシリアル化の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。