sorting - Merge two javascript objects if key is equal with either lodash, vanilla js, or d3 - Stack Overflow

admin管理员组

文章数量:1307633

I have 3 similar javascript objects.

var gdp = {
    "city": city,
    "gdp": [],  
};

var ine = {
    "city": city,
    "ine": [],  
};

var uRate = {
    "city": city,
    "uRate": [],  
};

Where I have many cities (n=28), and [] is my data array of integers with uniform length for each: gdp, ine, uRate.

GOAL: Combine these into a single object for each city:

var finalData = {
    "city": city, 
    "gdp": [],
    "ine": [],
    "uRate": [] 
}

I've tried variations of the following.

if ( ObjA.city == ObjB.city ) { Obj.city.metric = this.metric] };

Or, if city matches, add the metric (either gdp, ine or uRate) to the finalData object.

cities.forEach(function ( city ) {

    var metrics = ['gdp', 'ine', 'uRate'];

    metrics.forEach(function ( metric ) {

        if ( metric.city == city ) {  // edit: removed i

            var finalData = {
                "city": city, 
                "gdp": [],
                "ine": [],
                "uRate": [] 
            };

        }    

    })

       return finalData;  // edit: moved this per suggestion

};

Here is a similar example using $.extend() with jQuery: How to merge two object values by keys, but I am not using jQuery and would prefer either lodash, d3.js or vanilla js solution.

Thank You.

I have 3 similar javascript objects.

var gdp = {
    "city": city,
    "gdp": [],  
};

var ine = {
    "city": city,
    "ine": [],  
};

var uRate = {
    "city": city,
    "uRate": [],  
};

Where I have many cities (n=28), and [] is my data array of integers with uniform length for each: gdp, ine, uRate.

GOAL: Combine these into a single object for each city:

var finalData = {
    "city": city, 
    "gdp": [],
    "ine": [],
    "uRate": [] 
}

I've tried variations of the following.

if ( ObjA.city == ObjB.city ) { Obj.city.metric = this.metric] };

Or, if city matches, add the metric (either gdp, ine or uRate) to the finalData object.

cities.forEach(function ( city ) {

    var metrics = ['gdp', 'ine', 'uRate'];

    metrics.forEach(function ( metric ) {

        if ( metric.city == city ) {  // edit: removed i

            var finalData = {
                "city": city, 
                "gdp": [],
                "ine": [],
                "uRate": [] 
            };

        }    

    })

       return finalData;  // edit: moved this per suggestion

};

Here is a similar example using $.extend() with jQuery: How to merge two object values by keys, but I am not using jQuery and would prefer either lodash, d3.js or vanilla js solution.

Thank You.

• javascript
• sorting
• object
• d3.js
• lodash

Share Improve this question Follow edited May 23, 2017 at 11:46 CommunityBot 111 silver badge asked Apr 20, 2014 at 18:35 DeBraidDeBraid 9,44155 gold badges3333 silver badges4343 bronze badges 5

• 2 You need to move your return to after the loop. Also, what's i? – Ted Hopp Commented Apr 20, 2014 at 18:41
• Ok, I have moved those around, thank you. i was left over from previous failed attempt. – DeBraid Commented Apr 20, 2014 at 18:46
• @DeBraid Have you looked at _.extend? – Kyle Needham Commented Apr 20, 2014 at 18:55
• I don't quite understand what you're doing. Since gdp, etc. have a single city property, how do you expect to e up with an array of objects? At most one city value will match gdp.city, etc. – Ted Hopp Commented Apr 20, 2014 at 20:03
• Thanks Ted, I tried to grossly over-simplify what I am doing and it doesn't translate well! I have found that _.merge takes 3 objects and will perform the desired operation! – DeBraid Commented Apr 20, 2014 at 20:17

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

To anyone landing here from Google, it's now pretty easy to do this with vanilla JS using Object.assign().

This is a zero-dependency equivalent to the result in the accepted answer:

Object.assign({}, gdp, ine, uRate);

Note that this won't work in IE, but will work in Edge. The polyfill isn't too heavy, though.

Working solution at https://jsfiddle/bLhk6x6a/1/

Using lodash _.merge will satisfy the original question:

Given 3 objects:

var gdp = {
    "city": city,
    "gdp": [],  
};

var ine = {
    "city": city,
    "ine": [],  
};

var uRate = {
    "city": city,
    "uRate": [],  
};

Then bring in lodash and do:

var finalData = _.merge(gdp, ine, uRate);

and the result is as desired:

{
    "city": city, 
    "gdp": [],
    "ine": [],
    "uRate": [] 
}

Working solution here: http://jsfiddle/e99KQ/3/

本文标签：