javascript - 使用泛型方法访问对象值

Question

我正在进行一些重构并尝试创建一个通用方法，该方法能够使用对象数据填充给定的下拉列表。但是，我遇到了一个关于如何使访问不同对象数据通用的问题。例如:

原始方法

function populateDropdown(element, data) {
for (var i = 0; i < data.length; i++) 
    element.append('<option value=' + data[i].ID + '>' + data[i].Name + '</option>');
}

如果给定的对象数组具有字段 ID 和 Name，则此方法有效。我想要实现的是这样的

function populateDropdown(element, data, valueField, dataField) {
for (var i = 0; i < data.length; i++) 
    element.append('<option value=' + data[i].valueField + '>' + data[i].dataField + '</option>');
}

当我尝试像这样调用此方法时，结果是 Undefined:populateDropdown($('#myDropdown'), dataArray, "ID", "DataType") ;

当我尝试不使用 "" 时，我收到一个控制台错误，提示未定义 ID 和 DataType。有没有办法告诉我的方法我想从对象中获取哪些字段？

Answer 1

使用bracket notation -

function populateDropdown(element, data, valueField, dataField) {
    for (var i = 0; i < data.length; i++) 
        element.append('<option value=' + data[i][valueField] + '>' + data[i][dataField] + '</option>');
}

注意 - 为了使它对属性值中的特殊字符更具弹性，我会这样做:

$('<option />', { value : data[i][valueField] }).text(data[i][dataField]).appendTo(element);