JavaScript loop for creating an JSON object without duplicating keys

Question

Need some advice on how to create a JSON object by looping through an array without duplicating some of the keys

I am given an array that I need to split up into an object but without duplicating one of the keys

For example:

var myArray = [
    "name/ServiceV1/20190201/1/index.html",
    "name/ServiceV2/20190201/1/index.html",
    "name/ServiceV2/20190201/2/index.html",
    "name/ServiceV2/20190201/3/index.html",
    "name/ServiceV2/20190203/3/index.html",
    "name/ServiceV3/20190213/1/index.html"
];

Returns

[
    {
        "name": {
            "ServiceV1": {
                "20190201": {
                    "1": "index.html"
                }
            },
            "ServiceV2": {
                "20190201": {
                    "1": "index.html",
                    "2": "index.html",
                    "3": "index.html"
                },
                "20190203": {
                    "1": "index.html"
                },
            },
            "ServiceV3": {
                "20190213": {
                    "1": "index.html"
                },
            }
        }
    }
]

How could I get this to work? The code below is what I have already

var jsonify = function() {
  var myArray = [
    "name/ServiceV1/20190201/1/index.html",
    "name/ServiceV2/20190201/1/index.html",
    "name/ServiceV2/20190201/2/index.html",
    "name/ServiceV2/20190201/3/index.html",
    "name/ServiceV2/20190203/3/index.html",
    "name/ServiceV3/20190213/1/index.html"
  ];
  let end = [];

  // Loop through all the myArray items
  for (let i = 0; i < myArray.length; i++) {
    var itemparts = myArray[i].split("/");

    var newObject = {};
    var value = itemparts.pop();
    while (itemparts.length) {
      var obj = {};
      if (newObject.hasOwnProperty(itemparts.pop())) {
        return;
      } else {
        newObject[itemparts.pop()] = value;
      }
      obj[itemparts.pop()] = value;
      value = obj;
    }
    end.push(value);
  }

  // return the results
  return end;
};

But that returns this:

[
  {
    "name": {
      "ServiceV1": {
        "20190201": {
          "1": "index.html"
        }
      }
    }
  },
  {
    "name": {
      "ServiceV2": {
        "20190201": {
          "8": "index.html"
        }
      }
    }
  },
  {
    "name": {
      "ServiceV2": {
        "20190201": {
          "9": "index.html"
        }
      }
    }
  },
  {
    "name": {
      "ServiceV2": {
        "20190201": {
          "17": "index.html"
        }
      }
    }
  }
]

So I'm kinda lost on where to go next

Possible duplicate of Group array of object nesting some of the keys with specific names — Heretic Monkey
– Heretic Monkey, Commented Feb 13, 2019 at 16:35
That answer is using lodash and the other answer is using hard coded keys whereas my keys from the array that I split — Stephen
– Stephen, Commented Feb 13, 2019 at 16:38

Sébastien Vercammen · Accepted Answer · 2019-02-13 17:33:03Z

2

Stephen, you're creating new objects and pushing them onto the end of an array, which will always result in a list that gets longer and longer.

Your initial wording already hints at what's wrong: "how to create a JSON object".

Instead of creating new objects to add to a list, work with only one object that you modify/update. Keep in mind objects are references in JavaScript.

I use recursion in this example because it's a beautiful fit.

// WARNING: This code assumes a very specific text structure.
// It's for a specific use case, not a generic solution. Details in comments below.
const result = {};  // References are immutable in JS' const, not values.
const texts = [
    'a/b/c/file1.html',
    'b/c/d/file2.html',
    'a/b/e/file3.html'
];

function gluePartsToObject(obj, parts) {
    // End of the line.
    if (parts.length === 1) return parts.shift();

    // We've still got some ways to go.
    const part = parts.shift();
    if (obj.hasOwnProperty(part)) {
        // Re-use object reference.
        obj[part] = gluePartsToObject(obj[part], parts);
    } else {
        // Don't have an object yet to reference, create one.
        obj[part] = gluePartsToObject({}, parts);
    }
    
    return obj;
}

// ES2015 "of". Can be replaced with a regular loop for compatibility.
for (text of texts) {
    let parts = text.split('/');
    gluePartsToObject(result, parts);
}

console.log(result);

edited Feb 13, 2019 at 17:33

answered Feb 13, 2019 at 17:15

Sébastien Vercammen

6734 silver badges8 bronze badges

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

1 Comment

Stephen Over a year ago

That's awesome! It works just how I need it too thank you and thank you for the commented code :)

Collectives™ on Stack Overflow

JavaScript loop for creating an JSON object without duplicating keys

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related