JavaScript で CSV を配列にロード
CSV はテキストファイルです。区切り文字としてコンマを使用して、さまざまな値を区切ります。
この記事では、JavaScript を使用して CSV ファイルを配列にロードします。
JavaScript で jQuery-csv プラグインを使用して CSV を配列にロードする
jQuery ライブラリは、CSV ファイルを配列に読み込むことができる jquery-csv プラグインを提供します。
例えば、
array = $.csv.toArrays(csv, {
delimiter: '\'',
separator: ';', // Sets a custom field separator character
});
delimiter プロパティと separator プロパティを使用して、カスタムの区切り文字と区切り文字を設定できます。最終結果は配列に格納されます。
JavaScript で CSV を配列にロードするユーザー定義関数を作成する
FileReader クラスを使用して、必要な CSV ファイルを文字列として読み取ります。これを配列に格納するには、slice()、split()、および map() 関数を使用します。slice() 関数は、それが実装されている古い配列の一部を含む新しい配列を返すのに役立ちます。map() 関数は、配列内のすべての要素で提供される関数を提供することにより、新しい配列を返すのに役立ちます。split() 関数は、指定された区切り文字を使用して、文字列を配列の形式のサブ文字列に分割するのに役立ちます。
以下のコードを参照してください。
function csv_To_Array(str, delimiter = ',') {
const header_cols = str.slice(0, str.indexOf('\n')).split(delimiter);
const row_data = str.slice(str.indexOf('\n') + 1).split('\n');
const arr = row_data.map(function(row) {
const values = row.split(delimiter);
const el = header_cols.reduce(function(object, header, index) {
object[header] = values[index];
return object;
}, {});
return el;
});
// return the array
return arr;
}
ファイルの最初の行にヘッダーが含まれていると想定しています。slice() 関数は、最初から最初の\n インデックスまで開始し、split() 関数を使用して、区切り文字に基づいて文字列を配列に分割します。同様に、これら 2つの関数を使用して行を格納します。次に、行を配列にマップします。map() 関数を使用して、行の各値を配列に分割します。reduce() 関数はヘッダーとともに使用され、オブジェクトを作成し、必要なヘッダーを使用して行の値を追加し、このオブジェクトを返します。このオブジェクトは配列に追加されます。最後に、オブジェクトの配列である最終的な配列を返します。