如何在外层$.each中以内层$.each的dval作为value对象的属性名

原始代码片段：

$.each(arr, function (index, value) {
     
   var row = $('.marksEntryForm').find('table tbody').find('tr.std_adm_' + value.adm_no);
     
   $.each(data.distributions, function (i, dval) {           
           
     // row.find("td input."+dval).val(value.dval);
           
   });
});

row.find("td input.theory").val(value.theory);
row.find("td input.practical").val(value.practical);

需求说明：需要编写大量类似value.theory、value.practical的重复代码，而这些属性名已能在第二个$.each循环中通过dval获取，希望改用value[dval]替代这类写法，减少重复代码。

直接修改第二个$.each循环内的代码即可，利用JavaScript的方括号属性访问语法动态获取属性值，同时动态拼接选择器：

$.each(arr, function (index, value) {
     
   var row = $('.marksEntryForm').find('table tbody').find('tr.std_adm_' + value.adm_no);
     
   $.each(data.distributions, function (i, dval) {           
     // 用方括号语法value[dval]替代value.dval，动态获取属性值
     row.find("td input." + dval).val(value[dval]);
   });
});

原理说明 #

JavaScript中访问对象属性有两种方式：

• 点语法：obj.property，适用于属性名是固定字符串的场景
• 方括号语法：obj[propertyName]，适用于属性名是变量或包含特殊字符的场景

这里dval是循环中动态拿到的属性名字符串（比如"theory"、"practical"），所以必须用方括号语法value[dval]来获取对应的属性值，这样就能自动遍历所有data.distributions中的属性名，不用再手动写重复的赋值代码。

内容的提问来源于stack exchange，提问作者Sail Goyal