如何创建动态命名的JavaScript对象属性？

Question

这是我所拥有的

<form>
  <input type="text" name="item1" class="grab" value="userInput" />
  <input type="text" name="somethingelse1" class="grab" value="differentUserInput" />
  ... (any number of inputs)
</form>

使用JQuery/Javascript，我想构建一个包含名称-值对的对象数组，如下所示：

output = [ {item1: userInput}, {somethingelse1: differentUserInput} ... etc.];

我尝试过这个方法，但没有成功：

var output = new Array();
$('.grab').each( function(index) { 
    output.push({$(this).attr('name'): $(this).val()} );
});

我尝试了几种变化，包括使用eval()进行实验，但都没有成功。如果我删除$(this).attr('name')并给它一个静态名称，它就可以工作...那么我该如何创建动态命名的对象？

- user988300

Answer 1

字面对象语法不能用于非文字键。 要使用非文字键与对象，需要使用以下object[keyExpression]表示法。（当keyExpression = "key"时，这相当于object.key，但请注意前者情况下将表达式作为键，而后者则是标识符。）

var output = []
$('.grab').each(function(index) { 
    var obj = {}
    obj[$(this).attr('name')] = $(this).val()
    output.push(obj)
})

编程愉快。

---

此外，还要考虑使用.map()函数。

var output = $('.grab').map(function() { 
    var obj = {}
    obj[$(this).attr('name')] = $(this).val()
    return obj
})

- user166390

---

谢谢，那个有效。感谢您的快速回复和有用的信息。 - user988300

Answer 2

我只将表单的ID作为此函数的参数：

function form2JSON(form){
    var info_ser = $('#'+form).serialize();
    var data = info_ser.split('&');
    var output = {};
    $.each( data, function( i, l ){
        var data_input = l.split('=');
        output[data_input[0]] = data_input[1];
    });
   return output;
}

结果对象大致如下：Object { fieldname="value", fieldname1="value1", fieldname2="value3", ...}

- Francisco Paz