JavaScript - set object property by path

In this article, we would like to show you how to set object property by the path in JavaScript. 

In the below example, we create a function that takes three arguments:

• object that we modify,
• path to the property in the object (delimited by '.'),
• value that is set under the specified path.

With the function, we can create new object properties and specify their value or override existing ones.

Practical example

// ONLINE-RUNNER:browser;

const setObjectProperty = (object, path, value) => {
  	const parts = path.split('.');
  	const limit = parts.length - 1;
	for (let i = 0; i < limit; ++i) {
      	const key = parts[i];
    	object = object[key] ?? (object[key] = {});
    }
  	const key = parts[limit];
    object[key] = value;
};


// Usage example:

const data = {};

setObjectProperty(data, 'user.username', 'john');
setObjectProperty(data, 'user.password', 'Secret$$');
setObjectProperty(data, 'rapot.title', 'Storage usage raport');
setObjectProperty(data, 'rapot.goal', 'Remove unused data.');

console.log(JSON.stringify(data, null, 4));

See also

1. JavaScript - get object property by path