web-dev-qa-db-ja.com

2つのjsonオブジェクトをjqueryでマージする

私は2つのjsonオブジェクトを持っています：

http://example.com/search.json?section=saloon

そして

http://example.com/search.json?section=coupe

これら2つのオブジェクトを1つのオブジェクトに結合する方法を探していました。

前もって感謝します。

jqueryajaxjsonobjectmerge
21
echez

extend を使用します

var object = $.extend({}, object1, object2);

target（first）引数として空のオブジェクトを渡すことで、2番目のオブジェクトをマージしたい場合に両方のオブジェクトを保持できます。

$.extend(object1, object2);

[〜＃〜] demo [〜＃〜]

52
Rafay

さて、JSONがフェッチされ解析されたら、プロパティを反復処理して新しいオブジェクトに追加できます。ただし、同じ名前のプロパティがある場合は上書きされますので注意してください。

var data1 = '{"foo": 123, "test":"foo"}';
var data2 = '{"bar": 456, "test":"bar"}';

var json1 = JSON.parse(data1);
var json2 = JSON.parse(data2);

var merged = {};
for(var i in json1) {
    if (json1.hasOwnProperty(i))
        merged[i] = json1[i];
}
for(var i in json2) {
    if (json2.hasOwnProperty(i))
        merged[i] = json2[i];
}

console.log(merged);

結果としてマージされたJSONオブジェクトは次のようになります。

{foo: 123, test: "bar", bar: 456}

[〜＃〜] demo [〜＃〜]

編集：nigmaが言及したように 、jQueryを使用している場合は $.extend 。既存のオブジェクトを変更したくない場合は、最初に空のオブジェクトを渡すことを忘れないでください。

5
Alex Turpin

これらのすべては、1つのプロパティが異なる場合でもオブジェクト全体を上書きします。新しいプロパティでオブジェクトを追加し、JSONのリーフのみを上書きする場合は、これを使用します。

[〜＃〜] demo [〜＃〜]

//smart not to delete entire object if a property is different, (unlike  $.extend or _.extend)
// {"a":{"b":"c", "e":"f"}},{"a":{"b":"x"}} -> {"a":{"b":"x", "e":"f"}} not {"a":{"b":"x"}}
//obj1 is not effected,
//obj1 values are overwriten at leaves of obj2
//  smartJSONextend({"a":{"b":"c"}},{"a":"d"}) - {"b":"c"} will be "d"

function smartJSONextend(obj1, obj2) {
    //clone
    var mergedObj = JSON.parse(JSON.stringify(obj1));

    (function recurse(currMergedObj, currObj2){
        var key;

        for (key in currObj2) {
            if (currObj2.hasOwnProperty( key )){

                //keep path alive in mergedObj
                if (!currMergedObj[key]){
                    currMergedObj[key] = undefined;
                }

                if ( typeof currObj2[key] === "string" || typeof currObj2[key] === "number" || typeof currObj2[key] === "boolean" ){
                //overwrite if obj2 is leaf and not nested
                    currMergedObj[key] = currObj2[key];
                } else if (typeof currObj2[key] === "object"){
                //obj2 is nested

                    //and currMergedObj[key] is undefined, sync types
                    if (!currMergedObj[key]) {
                        //obj2[key] ifArray
                        if(currObj2[key].length !== undefined){
                            currMergedObj[key] = [];
                        } else {
                            currMergedObj[key] = {};
                        }
                    }
                    recurse(currMergedObj[key], currObj2[key]);
                }
            }
        }
    }(mergedObj, obj2));

    return mergedObj;
}
2
googamanga

あなたはマージを使うことができます

var mergedObj = $.merge(jsonObj1, jsonObj2);
1
Chtiwi Malek