JavaScript を使用して CSV ファイルからデータを読み取る方法?

JavaScript を使用して *.CSV ファイルからデータを読み取る方法?

CSV (カンマ区切り値) ファイルは、表形式データを保存するための一般的な形式です。 JavaScript を使用して CSV ファイルからデータを読み取るには、外部ライブラリを使用するか、独自の解析関数を実装できます。

jQuery-CSV ライブラリの使用

jQuery-CSV は、 JavaScript で CSV データを解析するための一般的なライブラリ。 CSV データをオブジェクトの配列に自動的にマッピングする便利なメソッド $.csv.toObjects(csv) が提供されます。

// Assuming you've included jQuery-CSV in your HTML
var data = $.csv.toObjects(csv);

// Output
[
  { heading1: "value1_1", heading2: "value2_1", ... },
  { heading1: "value1_2", heading2: "value2_2", ... },
  ...
];

カスタム解析関数

外部ライブラリを使用したくない場合は、独自の解析関数を作成できます。簡略化した例を次に示します。

function parseCSV(csv) {
  // Split the CSV into lines
  var lines = csv.split("\n");

  // Extract the header line
  var headers = lines[0].split(",");

  // Remove the header line from the CSV
  lines.shift();

  // Loop through the remaining lines and create objects
  var data = [];
  for (var i = 0; i < lines.length; i++) {
    // Split the line into values
    var values = lines[i].split(",");

    // Create an object using the headers as keys
    data.push(
      Object.fromEntries(
        headers.map((h, idx) => [h, values[idx]])
      )
    );
  }

  // Return the parsed data
  return data;
}

CSV データの例

heading1,heading2,heading3,heading4,heading5
value1_1,value2_1,value3_1,value4_1,value5_1
value1_2,value2_2,value3_2,value4_2,value5_2

出力

[
  { heading1: "value1_1", heading2: "value2_1", ... },
  { heading1: "value1_2", heading2: "value2_2", ... },
  ...
];

注意: サンプルの CSV データには行がありません休憩します。解析する前に改行を追加してデータを有効な CSV にすることをお勧めします。

以上がJavaScript を使用して CSV ファイルからデータを読み取る方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。