How to perform deep optional assignment in Javascript?

Question

Say I have an object named foo, and I would like to perform the following operation:

foo.bar.baz.qwer.asdf = 5;

The issue is that bar may not exist, but if it does exist, then baz inside of it may not exist, etc.

I thought I would be able to do something like this:

foo?.bar?.baz?.qwer?.asdf = 5, but alas, that sort of chaining only seems to work with retrieving values, not setting values.

The desired behavior is that if something like baz already exists, then that object is just accessed (and its existing members are maintained), but if baz does not exist, then that property is created on the fly.

That is, let's say only foo.bar existed. Then after the above assignment operation, the resulting object would be:

foo {
  bar: {
    baz: {
      qwer: {
        asdf: 5
      }
    }
  }
}

So my question is: can this be done with existing language syntax constructs, or must a helper function be created? If so, does this sort of function have a name that I could search for and reference?

Answer 1

I have written this:

function setProperty(obj, property, value) {
    const properties = property.split('.');
    const lastProperty = properties.pop();
    for (let prop of properties) {
        if (!obj[prop]) {
            obj[prop] = {};
        }
        obj = obj[prop];
    }
    obj[lastProperty] = value;
}

const startObj = {'a': {}};

setProperty(startObj, 'a.b.c.d.e', 'e is the best letter');
console.log(startObj);

However, it will have unexpected behaviors if one of the intermediate properties exists but isn't an object. Eg test the above function with the starting object {a:{b:2}}

Also, please note that what obj means changes as the function processes. At first, it means the base object, but it goes on to mean each nested object during the loop.