使用 eval(） JS 动态创建对象

Dynamically creating an object using eval() JS

本文关键字：动态 创建对象 JS eval 使用      更新时间：2023-09-26

我正在尝试在javascript中动态创建一个对象。这是我编写的JS代码：

var table = $("#eidtPersonalInfoTbl");
var trs = table.find('tr');
var obj = { };
$(trs).each(function(index, row){
     var field = $(row).find('td').eq(0).html();
     var value = $(row).find('td').eq(1).html();
     eval('obj.' + field + ' = ' + value );
});

下面是该表的 HTML 标记：

<table class="table" border="1" id="eidtPersonalInfoTbl">
<tr> 
    <td class="span3 hidden-phone" > Name </td>
    <td class="span5"> Name </td>       
</tr>
<tr>
    <td class="span3 hidden-phone"> Address</td>
    <td class="span5"> Address </td>
</tr>
<tr>
    <td class="span3 hidden-phone">Area</td>
    <td class="span5"> Area</td>                                        
<tr>
<tr>
    <td class="span3 hidden-phone">Gender</td>
    <td>Male</td>                                                       </tr>           
<tr> 
    <td class="span3 hidden-phone" > Salutation </td>
    <td class="span5"> Dr</td>                                      
</tr>   
<tr>
    <td class="span3 hidden-phone">State</td>
    <td class="span5"> State </td>                                          
<tr>
    <tr>
    <td class="span3 hidden-phone">City</td>
    <td class="span5"> City </td>                                       
</tr>
<tr> 
    <td class="span3 hidden-phone" > Postel Code </td>
    <td class="span5"> Postel Code </td>                                        
</tr>
<tr> 
    <td class="span3 hidden-phone" > Phone# </td>
    <td class="span5"> 04128741 </td>                                       
</tr>
<tr> 
    <td class="span3 hidden-phone" > Mobile# </td>
    <td class="span5"> 03218741525</td>                                     
</tr>
<tr> 
    <td class="span3 hidden-phone" > Cover Letter </td> 
    <td>Cover letter goes here</td>
</tr>                       
<tr>
    <td> <input type="submit" name="per-det" class="btn btn-success span5" value="Update and Cont."></td>
</tr>

每当我尝试执行此操作时，它都会给我此错误

未定义的变量名称

使用它更容易、更安全、更快捷：

obj[field] = value;

。而不是eval('obj.' + field + ' = "' + value + '"')，这显然具有相同的目的。

您会看到现在看到的内容，因为value应该用引号括起来。例如，如果 field 和 value 都等于 'Name'（字符串），则现在的 evalled 表达式将如下所示......

obj.Name = Name

。显然会导致"未定义的变量名称"错误。

这里有两个旁注。首先，在这一行中再次包装 jQuery 对象中的trs是没有意义的......

$(trs).each(function(index, row)

。因为它已经是一个jQuery对象（table.find('tr')的结果）。如果您遵循一个简单的约定，则更容易看到这种冗余：在用于存储 jQuery 对象的所有变量的名称前面使用 $ ：

var $table = $("#eidtPersonalInfoTbl");
var $trs   = $table.find('tr');
// ...
// $($trs) - obviously redundant

其次，在这些行中两次通过 DOM 有点浪费：

 var field = $(row).find('td').eq(0).html();
 var value = $(row).find('td').eq(1).html();

我宁愿这样重写它：

 var $tds = $(row).find('td');
 var field = $tds.eq(0).html(); // or just $tds[0].innerHTML;
 var value = $tds.eq(1).html(); // or just $tds[1].innerHTML;
相关文章：