web-dev-qa-db-ja.com

AjaxデータのJavaScriptオブジェクトまたは配列をJSONに変換する

そのため、要素情報を含む配列を作成しています。すべての要素をループし、インデックスを保存します。何らかの理由で、この配列をjsonオブジェクトに変換できません！

これは私の配列ループです：

var display = Array();
$('.thread_child').each(function(index, value){
   display[index]="none";
   if($(this).is(":visible")){
      display[index]="block";
   }
});

私はそれをJSONオブジェクトに変えようとします：

data = JSON.stringify(display);

適切なJSON形式を送信していないようです！

このようにコードを渡すと、機能し、情報を送信します。

data = {"0":"none","1":"block","2":"none","3":"block","4":"block","5":"block","6":"block","7":"block","8":"block","9":"block","10":"block","11":"block","12":"block","13":"block","14":"block","15":"block","16":"block","17":"block","18":"block","19":"block"};

JSON.stringifyオブジェクトでアラートを実行すると、ハンドコーディングされたオブジェクトと同じように見えます。しかし、それは機能しません。

私はこれを解決しようとして夢中になります！ここで何が欠けていますか？この情報を送信して、ハンドコーディングされた形式を取得する最良の方法は何ですか？

私はこのajaxメソッドを使用してデータを送信しています：

$.ajax({
        dataType: "json",
        data:data,
        url: "myfile.php",
        cache: false,
        method: 'GET',
        success: function(rsp) {
            alert(JSON.stringify(rsp));
        var Content = rsp;
        var Template = render('tsk_lst');
        var HTML = Template({ Content : Content });
        $( "#task_lists" ).html( HTML );
        }
    });

情報を表示しているため（更新または挿入ではないため）GETメソッドを使用しています。 phpファイルに表示情報のみを送信します。

終了ソリューション

var display = {};
$('.thread_child').each(function(index, value){
   display[index]="none";
   if($(this).is(":visible")){
      display[index]="block";
   }
});

$.ajax({
        dataType: "json",
        data: display,
        url: "myfile.php",
        cache: false,
        method: 'GET',
        success: function(rsp) {
            alert(JSON.stringify(rsp));
        var Content = rsp;
        var Template = render('tsk_lst');
        var HTML = Template({ Content : Content });
        $( "#task_lists" ).html( HTML );
        }
    });
javascriptarraysjsonstringify
32
Christine Wilson

確かではありませんが、JSONで配列がどのようにシリアル化されるかに驚くことでしょう。問題を切り分けましょう。次のコードを検討してください。

var display = Array();
display[0] = "none";
display[1] = "block";
display[2] = "none";

console.log( JSON.stringify(display) );

これは印刷されます：

["none","block","none"]

これがJSONが実際に配列をシリアル化する方法です。しかし、あなたが見たいのは次のようなものです：

{"0":"none","1":"block","2":"none"}

この形式を取得するには、配列ではなくオブジェクトをシリアル化します。したがって、上記のコードを次のように書き換えましょう。

var display2 = {};
display2["0"] = "none";
display2["1"] = "block";
display2["2"] = "none";

console.log( JSON.stringify(display2) );

これは、希望する形式で印刷されます。

ここでこれをいじることができます： http://jsbin.com/oDuhINAG/1/edit?js,console

70
Shital Shah

オブジェクトでJSON.stringify(object)を使用できます。次のコードであるこのJSON.stringify(convArrToObj(array))のように、配列をオブジェクトに再帰的に変換する関数を作成しました（詳細は- この答え ）：

// Convert array to object
var convArrToObj = function(array){
    var thisEleObj = new Object();
    if(typeof array == "object"){
        for(var i in array){
            var thisEle = convArrToObj(array[i]);
            thisEleObj[i] = thisEle;
        }
    }else {
        thisEleObj = array;
    }
    return thisEleObj;
}

より汎用的にするには、JSON.stringify関数をオーバーライドできます。再度心配する必要はありません。これを行うには、ページの上部に貼り付けます。

// Modify JSON.stringify to allow recursive and single-level arrays
(function(){
    // Convert array to object
    var convArrToObj = function(array){
        var thisEleObj = new Object();
        if(typeof array == "object"){
            for(var i in array){
                var thisEle = convArrToObj(array[i]);
                thisEleObj[i] = thisEle;
            }
        }else {
            thisEleObj = array;
        }
        return thisEleObj;
    };
    var oldJSONStringify = JSON.stringify;
    JSON.stringify = function(input){
        return oldJSONStringify(convArrToObj(input));
    };
})();

そして今、JSON.stringifyはarraysまたはobjectsを受け入れます！ （ 例のあるjsFiddleへのリンク ）

編集：

これはもう少し効率的なバージョンですが、信頼性が低い場合もそうでない場合もあります（不明-JSON.stringify(array)alwaysは[]を返しますが、そうしない理由はあまりわかりません。したがって、この関数は、objectでJSON.stringifyを使用するときの作業が少し少ないため、より良いはずです。

(function(){
    // Convert array to object
    var convArrToObj = function(array){
        var thisEleObj = new Object();
        if(typeof array == "object"){
            for(var i in array){
                var thisEle = convArrToObj(array[i]);
                thisEleObj[i] = thisEle;
            }
        }else {
            thisEleObj = array;
        }
        return thisEleObj;
    };
    var oldJSONStringify = JSON.stringify;
    JSON.stringify = function(input){
        if(oldJSONStringify(input) == '[]')
            return oldJSONStringify(convArrToObj(input));
        else
            return oldJSONStringify(input);
    };
})();

jsFiddle with example here

jsパフォーマンステスト、jsPerf経由

17
JVE999