Zugriff auf Objektwerte mit generischer Methode

Question

Ich mache einige Refactoring und versuche, eine generische Methode zu erstellen, die in der Lage ist, bestimmte Dropdowns mit Objektdaten aufzufüllen. Ich stoße jedoch auf ein Problem, wie man den Zugriff auf verschiedene Objektdaten generisch machen kann. Zum Beispiel:

Original-Methode

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

Dies funktioniert, wenn eine bestimmte Reihe von Objekten, das Feld ID und Name hat. Was ich versuche zu erreichen ist so etwas wie dieses

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>'); 
} 

Als ich versucht habe, ruft diese Methode wie folgt ich Undefined als Ergebnis erhalten: populateDropdown($('#myDropdown'), dataArray, "ID", "DataType");

Und wenn ich habe versucht, ohne die "" I Erhalten Sie einen Konsolenfehler, der besagt, dass ID und DataType nicht definiert ist. Gibt es eine Möglichkeit, meiner Methode mitzuteilen, welche Felder ich vom Objekt haben möchte?

Answer 1

Verwendung 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>'); 
} 

Hinweis - das ist ein wenig belastbarer, um Sonderzeichen in den Eigenschaftswerten zu machen, würde ich dies stattdessen tun:

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

Answer 2

können Sie tun data[i][valueField] und data[i][dataField] :

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>'); 
} 

Answer 3

Verwenden Sie bracket notation[], um die Eigenschaften zugreifen:

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>'); 
} 

Answer 4

Was die anderen gesagt, nicht sicher, ob dies hilfreich ist, nur zu ihrer Information Sie auch Standardwerte definieren können, wenn Sie sie nicht passieren, wie so ...

function populateDropdown(element, data, valueField, dataField) { 
    valueField = valueField || 'some_default_value'; 
    dataField = dataField || 'some_default_value'; 

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

Dann können Sie es so nennen, und Valuefield datafield params heraus verlassen:

populateDropdown('someElement', 'someValue');