Setting a deep JS object key using a lookup string

Question

How do I set deep properties in a JavaScript object using a dot-syntax string to specify which property I want to change?

For simple objects, I could just use data['property_name'] = 'foo', but I don't necessarily know how deeply nested the data is going to be.

Below is some example code with how I'd like to be able to format the data in the end. For all I know there's a nice way that JS already allows you to do this, but I haven't been able to find it yet.

Plunker here.

var items = [
    {
        lookup_string: "User.UserProfile.name",
        value: "John Smith"
    },
    {
        lookup_string: "User.email",
        value: "johnsmith@example.com"
    },
]



var data = {};

items.forEach(function(item){
    // Inside this loop, set the appropriate keys under data. Is there a non-convoluted way to do this?
});

console.log("items", items);
console.log("Results", data)

// In the end, data should look like this:

var desiredData = {
    User: {
        UserProfile: {
            name: 'John Smith'
        },
        email: 'johnsmith@example.com'
    }
}

I believe you're going to have to manually assign the values by looping over `lookup_string.split('.')` — Hamms, Jun 29 '17 at 21:04
Possible duplicate: https://stackoverflow.com/questions/6393943/convert-javascript-string-in-dot-notation-into-an-object-reference — Frank Modica, Jun 29 '17 at 21:06

score 2 · Accepted Answer · answered Jun 29 '17 at 21:05

You could split the lookup_string and reduce an object with a default object. Later assign the value.

function setValue(object, path, value) {
    var keys = path.split('.'),
        last = keys.pop();

    keys.reduce(function (o, k) {
        return o[k] = o[k] || {};
    }, object)[last] = value;
}

var items = [{ lookup_string: "User.UserProfile.name", value: "John Smith" }, { lookup_string: "User.email", value: "johnsmith@example.com" }],
    object = {};

items.forEach(function(o) {
    setValue(object, o.lookup_string, o.value);
});

console.log(object);

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

score 0 · Answer 2 · answered Jun 29 '17 at 21:09

you will have to loop over all the keys from lookup_string.split('.') and assign values, something like this:

  var items = [
        {
            lookup_string: "User.UserProfile.name",
            value: "John Smith"
        },
        {
            lookup_string: "User.email",
            value: "johnsmith@example.com"
        },
    ];

    var data = {};

    items.forEach(function(item){
       var lookup = item.lookup_string.split('.');
       var lastKey;
       lookup.map(function(key){
            data[key] = {};
            lastKey = key;
       });
       data[lastKey] = item.value;
    });

    console.log("items", items);
    console.log("Results", data)

    // In the end, data should look like this:

    var desiredData = {
        User: {
            UserProfile: {
                name: 'John Smith'
            },
            email: 'johnsmith@example.com'
        }
    };

Setting a deep JS object key using a lookup string

2 Answers2