Welches Programmiermuster soll für einen generischen HTML-Tabellendatenextraktor verwendet werden?JavaScript

Javascript-Forum
Anonymous
 Welches Programmiermuster soll für einen generischen HTML-Tabellendatenextraktor verwendet werden?

Post by Anonymous »

Problemzusammenfassung: Ich versuche, eine leicht lesbare und verwendbare Funktion zu erstellen, um eine benutzerdefinierte Filterung der aus einer HTML-Tabelle extrahierten Datenspalten mit Vanilla-JavaScript (vielleicht jQuery) zu ermöglichen.
Erklärung: Ich möchte Daten aus mehreren HTML-Tabellen als Teil eines benutzerdefinierten Skripts abrufen, das ich erstelle. Dieselbe Aufgabe viele Male => eine Funktion erstellen. Ich versuche, eine gute Möglichkeit zu finden, den Code so zu strukturieren, dass die Verwendung nicht verwirrend und das Lesen nicht schmerzhaft ist. (Der aktuelle Code ist unten)
Ich habe diesen speziellen Vorschlag gefunden, den ich als Modell verwende.

https://stackoverflow.com/a/70615840/25437238
Diese Funktion macht zwar das, was ich will, erfordert aber eine benutzerdefinierte Filterfunktion. Ich würde mir mehr Flexibilität wünschen, um ihm eine von vier verschiedenen Eingabeoptionen geben zu können:

1. Ein fn, der einen Wert zurückgibt. Beispiel:

Code: Select all

   const data = extractData('myTable', (x) => ({
name: x[0],
address: x[1],
city: x[2],
state: x[3],
}));
2. [0,1,0,1,1,0,1] => Boolesches Array. Verwendet die schmalste Option zwischen der Tabelle oder dem Array. Gibt ein 2D-Array zurück

3. [1,3,5,7, 1] => die 'n-te' Spalte verwenden. (Spaltennummer kann wiederholt werden). Zahlen, die größer oder kleiner als die Anzahl der Spalten sind, haben undefinierte Werte.

4. CSV-Liste der Spaltentitel (verwenden Sie eine Fn, um eine nummerierte Liste zu erhalten, die in 3 eingeteilt wird)
Aus meiner Sicht habe ich drei Optionen:
  • Erstellen Sie für jede Eingabe eine andere Funktion (was in einer typisierten Sprache geschehen würde)
  • Verwenden Sie einen Parameter, den der Benutzer verwendet, um der Funktion mitzuteilen, was sie tun soll (aktuell). Implementierung--"filterOption")
  • Überprüfen Sie die Eingabe (mittels manueller Typprüfung usw.)
Die Frage: Gibt es ein Muster, das dies einfach oder offensichtlich macht?

Code: Select all

function extractHtmlTableData(tableIdOrEl="", filterOption=0, mapper=(data)=> {return data}){
var myTab, data;
// Get the table
if(typeof tableIdOrEl == "String") {
myTab = document.getElementById(tableId);
} else if(tableIdOrEl.nodeName =="TABLE") {
myTab = tableIdOrEl
} else {
return null;
}

// Get raw values from the table
if (myTab) {
data = [...myTab.rows].map((r) => [...r.cells].map((c) => c.innerText));
}

switch(filterOption){
case 0:
return data;
case 1:
return data.map(mapper);
case 2:
return filter2DWithBooleanAry(data, mapper);
case 3:
return filter2DWithNumberedAry(data, mapper);
case 4:
var mapper = filter2DWithNumberedAry(data[0], mapper);
return filter2DWithNumberedAry(data, mapper);
}
}

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post