How to convert JavaScript array (or delimited string) to an object with sub-objects

Question

I actually wish to convert a string to a deep object, but am pretty sure converting the string to an array is the first step. Let me explain.

I am using xeditable which by default will send {"name": "somePropertyName", "value": "someValue"} to the server, however, I wish to send {"somePropertyName": "someValue"}. I am able to accomplish this by setting $.fn.editable.defaults.params to the appropriate callback.

Now the part I am stuck on. I am using a special naming pattern that if the name has periods in it (i.e. name is a.b.c), I don't want to send {"a.b.c": "someValue"} to the server, but instead send {"a":{"b":{"c":"someValue"}}} to the server.

I've got a partially working version, however, it is not very elegant and more importantly I haven't gotten the last property working and have temporarily hardcoded it which is not acceptable.

How can this be accomplished?

$.fn.editable.defaults.params = function(params){
    return nvp2obj(params.name, params.value);
}

function nvp2obj(n, v, d) {
    d = d ? d : '.';
    n = n.split('.');
    var o = {};
    var r = o;
    n.reduce(function(total, currentValue, currentIndex, arr) {
        if(r) {
            r[currentValue]={};
            r=o[currentValue];
        }
        else {
            //this is obviously not correct
            o.a.b.c=v;
        }
        return o;
        }, o);
    return o;
}
var test = nvp2obj('a.b.c', 'someValue'); //{"a":{"b":{"c":"someValue"}}}
console.log('test', JSON.stringify(test));

Nina Scholz · Accepted Answer · 2019-04-11 14:57:45Z

4

You could iterate the given keys and assign the value by taking the last key.

function setValue(object, keys, value) {
    var last = keys.pop();
        
    keys.reduce((o, k) => o[k] = o[k] || {}, object)[last] = value;
}

var test = {};
    
setValue(test, 'a.b.c'.split('.'), 'someValue');
setValue(test, 'a.d.e'.split('.'), 'someValue2');
setValue(test, 'a.b.a'.split('.'), 'someValue3');

console.log(test);

edited Apr 11, 2019 at 14:57

answered Apr 11, 2019 at 14:39

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

2 Comments

Teh SoTo Over a year ago

objects seems unused on your function, object seems to work anyway as it's global.

Teh SoTo Over a year ago

This is the best answer by far.

dbramwell · Accepted Answer · 2019-04-11 14:56:33Z

2

How about this:

function nvp2obj(n, v, d) {
  n = n.split(d || '.');
  n.reverse()
  return n.reduce(function(res, it) {
    return {[it]: res}
  }, v)
}


var test = nvp2obj('a.b.c', 'someValue');
console.log('test', JSON.stringify(test));

test = nvp2obj('a|b|c', 'someValue', '|');
console.log('test', JSON.stringify(test));

Loops through the keys from the end (starts with 'c'), first returning an object with the last key corresponding to the desired value ( {c: value} ). Then {b: {c: value}}, then {a: {b: {c: value}}}

edited Apr 11, 2019 at 14:56

answered Apr 11, 2019 at 14:45

dbramwell

1,3467 silver badges13 bronze badges

2 Comments

Nina Scholz Over a year ago

what happens with the next value?

dbramwell Over a year ago

You mean if they want to add more keys and values to the same object afterwards as in your code? Not sure, don't think they specified that they need to do that.

Collectives™ on Stack Overflow

How to convert JavaScript array (or delimited string) to an object with sub-objects

2 Answers 2

2 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related