Javascript: How to create an object from a dot separated string?

Question

I ran into this potential scenario that I posed to a few of my employees as a test question. I can think of a couple ways to solve this problem, but neither of them are very pretty. I was wondering what solutions might be best for this as well as any optimization tips. Here's the question:

Given some arbitrary string "mystr" in dot notation (e.g. mystr = "node1.node2.node3.node4") at any length, write a function called "expand" that will create each of these items as a new node layer in a js object. For the example above, it should output the following, given that my object name is "blah":

blah: { node1: { node2: { node3: { node4: {}}}}}

From the function call:

mystr = "node1.node2.node3.node4";
blah = {};
expand(blah,mystr);

Alternately, if easier, the function could be created to set a variable as a returned value:

mystr = "node1.node2.node3.node4";
blah = expand(mystr);

Extra credit: have an optional function parameter that will set the value of the last node. So, if I called my function "expand" and called it like so: expand(blah, mystr, "value"), the output should give the same as before but with node4 = "value" instead of {}.

You should post your solution to CodeReview and ask for improvements there. — Dave
– Dave, Commented Jul 16, 2015 at 21:01
This is essentially a DFS (depth-first search), which uses a stack to keep track of the level you are on. — Mr. Polywhirl
– Mr. Polywhirl, Commented Jul 16, 2015 at 21:01
@dave: This is mostly hypothetical code, which is off-topic on Code Review. — Jamal
– Jamal, Commented Jul 16, 2015 at 21:03

Dzmitry Bachko · Accepted Answer · 2022-08-25 20:34:39Z

23

In ES6 you can do it like this:

const expand = (str, defaultVal = {}) => {
  return str.split('.').reduceRight((acc, currentVal) => {
    return {
      [currentVal]: acc
    }
  }, defaultVal)
}

const blah = expand('a.b.c.d', 'last value')

console.log(blah)

edited Aug 25, 2022 at 20:34

answered Aug 7, 2017 at 20:08

Dzmitry Bachko

5411 gold badge4 silver badges6 bronze badges

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

Comments

Oscar · Accepted Answer · 2015-07-16 21:14:38Z

Here's a method that popped up in my mind. It splits the string on the dot notation, and then loops through the nodes to create objects inside of objects, using a 'shifting reference' (not sure if that's the right term though).

The object output within the function contains the full object being built throughout the function, but ref keeps a reference that shifts to deeper and deeper within output, as new sub-objects are created in the for-loop.

Finally, the last value is applied to the last given name.

function expand(str, value)
{
    var items = mystr.split(".") // split on dot notation
    var output = {} // prepare an empty object, to fill later
    var ref = output // keep a reference of the new object

    //  loop through all nodes, except the last one
    for(var i = 0; i < items.length - 1; i ++)
    {
        ref[items[i]] = {} // create a new element inside the reference
        ref = ref[items[i]] // shift the reference to the newly created object
    }

    ref[items[items.length - 1]] = value // apply the final value

    return output // return the full object
}

The object is then returned, so this notation can be used:

mystr = "node1.node2.node3.node4";
blah = expand(mystr, "lastvalue");

They are not mandatory, but it is considered good practice to have them. The function here could not be minified without them but then the comments also needed to go.
In my opinion it looks way cleaner without semicolons. If you know when you should use them, you can leave them out when it's safe. UglifyJS2 minifies this perfectly without semicolons. It's always a controversial topic, but JavaScript's semicolons are most of the times optional.
Well like I said it's a very controversial topic, hence the very different opinions in the comments of the topic you linked to.

Anik Saha · Accepted Answer · 2019-03-18 09:14:15Z

1

var obj = {a:{b:{c:"a"}}};
const path = "a.b.c".split(".");
while(path.length > 1){
   obj = obj[path.shift()];
}
obj[path.shift()] = "a";

edited Mar 18, 2019 at 9:14

answered Mar 18, 2019 at 9:06

Anik Saha

4,4842 gold badges29 silver badges46 bronze badges

Comments

err0r · Accepted Answer · 2024-05-06 16:53:40Z

Having this:

const text = `auth.errors.invalid_otp
logout.success.message
common.operations.deleted.successful
validation.attributes.cart_item
common.operations.deleted.successful
validation.attributes.cart_item
common.messages.not_found
coupon.messages.max_usage
cart.messages.empty
cart.messages.empty`

You can convert it to json with this:

const jsonObj = text.split('\n').reduce((acc, cur) => {
    let obj = acc;
    const keys = cur.split('.');
    for (const key of keys) {
        obj[key] ??= keys.at(-1) == key ? '' : {};
        obj = obj[key]
    }
    return acc;
}, {});

console.log(JSON.stringify(jsonObj, null, 2));

Output:

{
  "auth": {
    "errors": {
      "invalid_otp": ""
    }
  },
  "logout": {
    "success": {
      "message": ""
    }
  },
  "common": {
    "operations": {
      "deleted": {
        "successful": ""
      }
    },
    "messages": {
      "not_found": ""
    }
  },
  "validation": {
    "attributes": {
      "cart_item": ""
    }
  },
  "coupon": {
    "messages": {
      "max_usage": ""
    }
  },
  "cart": {
    "messages": {
      "empty": ""
    }
  }
}

Collectives™ on Stack Overflow

Javascript: How to create an object from a dot separated string?

4 Answers 4

Comments

5 Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

5 Comments

Comments

Comments

Linked

Related