How to Edit JSON using Javascript?

Question

I have a JSONObject inside a JSONArray (like the below JSON). Now I have to add the productID value as the KEY of the Object like the Required JSON. I'm trying to do this via javascript. But I can't get the desired output.

I tried to find any solution on Google. But it doesn't work out. Can anyone guide me how to do this or show me any references ?

ORIGINAL JSON

[
{
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechert.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    },
..... it goes on
]

Required JSON

{
    "C05M01P001" : {
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole ",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechenart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg",
        "productCID": "C05",
        "productMID": "M01"
    }, 
..... it goes on
}

The "required JSON" is invalid. And that's not JSON but an array of objects — Andreas
– Andreas, Commented Apr 8, 2017 at 11:53
Your result cannot be what you suggest, but could be either an array of objects e.g. [ { "C05M01P001: {...}}, {"C05M01P002": {...}} ] or (probably makes more sense) a single object {"C05M01P001: {...}, "C05M01P002": {...}} - which do you need? — Stuart
– Stuart, Commented Apr 8, 2017 at 11:56
sorry for the confusion. As Err Hunter Suggested, it is a JSON Object. — Arulnadhan
– Arulnadhan, Commented Apr 8, 2017 at 11:59

mplungjan · Accepted Answer · 2017-04-08 12:04:06Z

1

You can achieve it with a single loop,

var inputJson = [{
  "productID": "C05M01P001",
  "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
  "productUnit": "1 kg",
  "productPrice": "Rs.50.00",
  "productSellingPrice": "",
  "productSID": "",
  "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
  "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
  "productCID": "C05",
  "productMID": "M01"
}, {
  "productID": "C05M01P002",
  "productName": "XYZ - Whole Wheat (முழு கோதுமை)",
  "productUnit": "1.3 kg",
  "productPrice": "Rs.40.00",
  "productSellingPrice": "",
  "productSID": "",
  "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
  "productDescription": "XYZ - Whole Wheat 1.3 kg..",
  "productCID": "C05",
  "productMID": "M01"
}];


var outputJson = {};

inputJson.forEach((singleProduct) => {
  outputJson[singleProduct.productID] = singleProduct;
});

console.log(outputJson);

And output will be,

{
    "C05M01P001": {
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    },
    "C05M01P002": {
        "productID": "C05M01P002",
        "productName": "XYZ - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1.3 kg",
        "productPrice": "Rs.40.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "XYZ - Whole Wheat 1.3 kg..",
        "productCID": "C05",
        "productMID": "M01"
    }
}

edited Apr 8, 2017 at 12:04

mplungjan

180k29 gold badges183 silver badges246 bronze badges

answered Apr 8, 2017 at 12:00

Gaurav Gandhi

3,2112 gold badges30 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Arulnadhan Over a year ago

The Fonts in the product name are not showing properly. How Can i Fix it ?

Gaurav Gandhi Over a year ago

You have to use correspond language font/characterset in your website. Google for Bamini Tamil font, and how to include and use fonts.

Mihai Alexandru-Ionut · Accepted Answer · 2017-04-08 12:11:51Z

1

You can use reduce method, which accepts a callback method and applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value.

var json=[
{
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    },
    {
        "productID": "C05M01P002",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    }
]
console.log(json.reduce(function(object,item){
    object[item.productID]=item;
    return object;
},{}));

edited Apr 8, 2017 at 12:11

answered Apr 8, 2017 at 11:53

Mihai Alexandru-Ionut

48.6k14 gold badges106 silver badges132 bronze badges

8 Comments

mplungjan Over a year ago

That was not quite what was asked. However it is preferable to have {"C05M01P001": { "productID": "C05M01P001", to [ "C05M01P001": { "productID": "C05M01P001",

Gaurav Gandhi Over a year ago

Yes, closest match to OP's question.

T.J. Crowder Over a year ago

@ErrHunter: Well, maybe. Better to get clarification first, before posting speculative answers that may not be what the OP needs at all.

Gaurav Gandhi Over a year ago

@T.J.Crowder, I agree to it.

mplungjan Over a year ago

OP changed the question to have correct object structure so you just need to drop the outer array

|

T.J. Crowder · Accepted Answer · 2017-04-08 12:01:57Z

You just loop through the array, creating an object with properties keyed by the item property. You can use a simple forEach:

var updated = {};
original.forEach(function(entry) {
  updated[entry.productID] = entry;
});

var original = [
{
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    }
];
var updated = {};
original.forEach(function(entry) {
  updated[entry.productID] = entry;
});
console.log(updated);

(Or even just a for loop.)

Or reduce, although some consider this an "abusage":

var updated = original.reduce(function(obj, entry) {
  obj[entry.productID] = entry;
  return obj;
}, {});

var original = [
{
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    }
];
var updated = original.reduce(function(obj, entry) {
  obj[entry.productID] = entry;
  return obj;
}, {});
console.log(updated);

Redu · Accepted Answer · 2017-04-08 15:28:26Z

0

Normally .reduce() is the tool for this job but since it's already given, for a variety you can also try a recursive approach as follows;

var os = [{x:1,y:"test"},{x:2,y:"more"},{x:3,y:"test"}],
folder = (a,p) => a.length && Object.assign({[a[0][p]]:a[0]},folder(a.slice(1),p));
console.log(folder(os,"x"));

Though in JS if you have a very long array of objects (100K+) I wouldn't recommend using recursive approaches at all.

answered Apr 8, 2017 at 15:28

Redu

26.3k6 gold badges61 silver badges84 bronze badges

Comments

Rohìt Jíndal · Accepted Answer · 2017-04-08 15:50:04Z

Try this :

var jsonObj = [
{
        "productID": "C05M01P001",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    },
    {
        "productID": "C05M01P002",
        "productName": "Aashirvaad Atta - Whole Wheat (முழு கோதுமை)",
        "productUnit": "1 kg",
        "productPrice": "Rs.50.00",
        "productSellingPrice": "",
        "productSID": "",
        "productImage": "http://www.thechennaikart.com/image/cache/Product_Images_2016/asvd-attaplain-atta-large-500x500.jpg",
        "productDescription": "Ashirvaad Atta - Whole Wheat 1 kg..",
        "productCID": "C05",
        "productMID": "M01"
    }
];

var obj = {};

for (var i in jsonObj) {
  obj[jsonObj[i].productID] = jsonObj[i];
}

console.log(obj);

Collectives™ on Stack Overflow

How to Edit JSON using Javascript?

5 Answers 5

2 Comments

8 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

8 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related