Я написал другое решение, используя рекурсию. Я использовал это для именования атрибута name входных элементов. Взять, к примеру, следующее:
<input type="number" name="testGroup.person.age" />
И скажем, мы установили значение этого входа на «25». У нас также есть объект в нашем коде где-то:
var data = {
testGroup: {
person: {
name: null,
age: null,
salary: null
}
}
};
Таким образом, цель здесь состоит в том, чтобы автоматически поместить значение в нашем элементе ввода в правильную позицию в этой структуре данных.
Я написал эту маленькую функцию для создания вложенного объекта на основе любого массива пространств имен, которые вы ему передаете:
var buildObject = function ( obj, namespaceArray, pos ) {
var output = {};
output[namespaceArray[pos]] = obj;
if ( pos > 0 ) {
output = buildObject(output, namespaceArray, pos-1);
}
return output;
};
Как это работает? Он начинается в конце массива namespaceArray и создает объект с одним свойством, именем которого является то, что находится в последнем слоте в namespaceArray, и значение которого составляет obj. Затем он повторяется, оборачивая этот объект в дополнительные объекты, пока у него не закончатся имена в namespaceArray. pos - длина массива namespaceArray. Вы можете просто обработать это при первом вызове функции, что-то вроде if ( typeof(pos) === "undefined" ) pos = namespaceArray.length - 1, но тогда у вас будет дополнительный оператор для оценки каждый раз, когда функция повторяется.
Сначала мы разбиваем атрибут name input на массив вокруг разделителей пространства имен и получаем значение ввода:
var namespaceArray = inputElement.name.split("."),
obj = inputElement.value;
// Usually you'll want to do some undefined checks and whatnot as well
Затем мы просто вызываем нашу функцию и присваиваем результат некоторой переменной:
var myObj = buildObject(obj, namespaceArray, namespaceArray.length - 1);
myObj теперь будет выглядеть так:
{
testGroup: {
person: {
age: 25
}
}
}
На данный момент я использую функцию расширения jQuery для объединения этой структуры обратно в исходный объект данных:
data = $.extend(true, data, myObj);
Однако объединение двух объектов не очень сложно сделать в JavaScript без фреймворка, и существует множество существующего кода , который хорошо справляется с работой.
Я уверен, что есть более эффективные способы сделать это, но этот метод хорошо отвечает моим потребностям.