Intended output: { children: { Display: { children: { … value: 2 } } } }

Real output: { children: {}, Display: {}, … value: 2 }


Code:

// Load default settings
let defaultSettings;

load("/assets/json/default-settings.json", 'json', function(defset) {
	defaultSettings = defset;

	// Create custom settings
	if(!Object.keys(localStorage).includes('settings')) {
		setLs('settings', JSON.stringify({}));
	};

	customiseSetting('Display/UI/Distance', 2)
});

function settingURL(url) {
	return('children/' + url.split('/').join('/children/') + '/value');
}

function customiseSetting(url, value) {
	url = settingURL(url);

	// Split the string by '/' and use reduce to access the nested properties
	const newSettings = url.split('/').reduce(function(accumulator, val, index, array) {
		// If the object does not have the current component as a property, create an empty object for it
	  	// If the current component is the last one, assign the value
	  	if (index == array.length - 1) {
			accumulator[val] = value;
	  	} else if (!accumulator.hasOwnProperty(val)) {
			accumulator[val] = {}; // update the accumulator object
		}

		log([accumulator, val, index, array])
		// Return the updated object
	  	return(accumulator);
	}, JSON.parse(ls('settings')));
	log(newSettings);
	setLs('settings', JSON.stringify(newSettings));
}

I’ve been trying unsuccessfully for several days to fix to what must be a simple error. I’ve looked over it myself, but I can’t find the cause of the bug. I asked Bing, which usually helps, but it was unhelpful. So I’m sorry to be bothering you, but if you could help me solve this problem, I would really appreciate it.