CODEWITHSUNDEEP
javascriptjquery
PSR
PSR

Reputation: 893

Convert object to another object using jQuery

I am getting a result in my JavaScript file which I want to convert into another object.

My original result

    [
  {
    "SName": "Set1",
    "Elements": [
      {
        "Id": "3",
        "Name": "Name1"
      },
      {
        "Id": "5",
        "Name": "Name2"
      }
    ]
  },
  {
    "SName": "Set2",
    "Elements": [
      {
        "Id": "7",
        "Name": "Name3"
      },
      {
        "Id": "8",
        "Name": "Name4"
      }
    ]
  }
]

Convert this to look like array of objects using jQuery or JavaScript. How can I achieve this? 

[
  {
    "SName": "Set1",
    "Id": 3,
    "Name": "Name1"
  },
  {
    "SName": "Set1",
    "Id": 5,
    "Name": "Name2"
  },
  {
    "SName": "Set2",
    "Id": 7,
    "Name": "Name3"
  },
  {
    "SName": "Set2",
    "Id": 8,
    "Name": "Name4"
  }
]

Upvotes: 0

Views: 592

Answers (5)

ILCAI
ILCAI

Reputation: 1234

You could use the $.extend method, which lets you create a copy of an object, while merging with another object.

var source = [] // Replace with the initalization of your source array
var destination = [];

for (var i = 0; i < source.length; i++) {
    var node = source[i];
    for (var j = 0; j < node.Elements.length; j++) {
        var subNode = node.Elements[j];
        newNode = $.extend(subNode, node);
        delete newNode["Elements"];
        destination.push(newNode);
    }
}

You can run the code in this fiddle.

Upvotes: 0

aaronofleonard
aaronofleonard

Reputation: 2576

var data =     [
  {
    "SName": "Set1",
    "Elements": [
      {
        "Id": "3",
        "Name": "Name1"
      },
      {
        "Id": "5",
        "Name": "Name2"
      }
    ]
  },
  {
    "SName": "Set2",
    "Elements": [
      {
        "Id": "7",
        "Name": "Name3"
      },
      {
        "Id": "8",
        "Name": "Name4"
      }
    ]
  }
];
console.log(data);

var newData = data.reduce(function (newArray, currentSet) {
    return newArray.concat(currentSet.Elements.map(function (element) {
        return Object.assign( { SName: currentSet.SName }, element);
    }));
}, []);

console.log(newData);

The key here is the reduce function. What we are doing is creating a brand new array, by looping through each value of the outer array. We continuously concatenate onto our new array with the values we map from the inner array.

Upvotes: 1

noitse
noitse

Reputation: 1045

Here is solution using jQuery, here is jsfiddle:

https://jsfiddle.net/noitse/3uk9qjnf/

I hope you know all key names so it wont be problem to do it fixed.

var json = [
  {
    "SName": "Set1",
    "Elements": [
      {
        "Id": "3",
        "Name": "Name1"
      },
      {
        "Id": "5",
        "Name": "Name2"
      }
    ]
  },
  {
    "SName": "Set2",
    "Elements": [
      {
        "Id": "7",
        "Name": "Name3"
      },
      {
        "Id": "8",
        "Name": "Name4"
      }
    ]
  }
]

var newJSON = []

$(json).each(function(index,value){

  $(value.Elements).each(function(index1,value1){
        newJSON.push({"SName":value.SName,"Id":value1.Id,"Name":value1.Name})   
})

})

alert(JSON.stringify(newJSON))

Here is code , what it does it loops through first JSON , then loops through its elements , then it push it to new array

Upvotes: 0

Nenad Vracar
Nenad Vracar

Reputation: 122047

You can do this with reduce(), forEach() and Object.assign()

var data = [{
  "SName": "Set1",
  "Elements": [{
    "Id": "3",
    "Name": "Name1"
  }, {
    "Id": "5",
    "Name": "Name2"
  }]
}, {
  "SName": "Set2",
  "Elements": [{
    "Id": "7",
    "Name": "Name3"
  }, {
    "Id": "8",
    "Name": "Name4"
  }]
}]

var result = data.reduce(function(r, e) {
  e.Elements.forEach(function(o) {
    r.push(Object.assign({SName: e.SName}, o))
  })
  return r;
}, [])

console.log(result)

Upvotes: 1

Nina Scholz
Nina Scholz

Reputation: 386620

You could iterate the array, the Elements and the properties and build a new object and push it to the result set.

var array = [{ "SName": "Set1", "Elements": [{ "Id": "3", "Name": "Name1" }, { "Id": "5", "Name": "Name2" }] }, { "SName": "Set2", "Elements": [{ "Id": "7", "Name": "Name3" }, { "Id": "8", "Name": "Name4" }] }],
    result = [];

array.forEach(function (a) {
    a.Elements.forEach(function (b) {
        var o = { SName: a.SName };
        Object.keys(b).forEach(function (k) {
            o[k] = b[k];
        });
        result.push(o);
    });
});

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

ES6

var array = [{ "SName": "Set1", "Elements": [{ "Id": "3", "Name": "Name1" }, { "Id": "5", "Name": "Name2" }] }, { "SName": "Set2", "Elements": [{ "Id": "7", "Name": "Name3" }, { "Id": "8", "Name": "Name4" }] }],
    result = [];

array.forEach(a => a.Elements.forEach(b => result.push(Object.assign({ SName: a.SName }, b))));

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Upvotes: 1

Related Questions