JavaScript FileReader 转换 CSV 文件：从逗号分隔符到 UTF-8 分号分隔符

2024-03-11 08:27:40

用JavaScript FileReader处理上传的CSV文件：从逗号分隔符转换为UTF-8分号分隔符

引言

导入第三方文件时经常会遇到各种格式问题，本文将深入探讨如何使用JavaScript FileReader将上传的逗号分隔符（CSV）文件转换为UTF-8分号分隔符。我们将详细介绍分步指南，提供代码示例，并解答常见问题。

使用FileReader转换CSV文件

步骤1：创建FileReader对象

创建一个新的FileReader对象，它负责读取文件的内容。

const reader = new FileReader();

步骤2：设置onload事件处理程序

定义一个onload事件处理程序，它将在文件读取完成后触发。在此处理程序中，我们将处理CSV数据。

reader.onload = function() {
  const csvData = reader.result;
  // 在此处理csvData
};

步骤3：使用readAsText()读取文件

使用readAsText()方法读取文件，指定UTF-8编码以确保正确处理非英语字符。

reader.readAsText(file, 'UTF-8');

转换CSV数据

在onload事件处理程序中，可以使用正则表达式或字符串操作方法将逗号分隔符替换为分号。

const csvDataWithSemicolons = csvData.replace(/,/g, ';');

保存转换后的CSV文件

将转换后的CSV数据保存到新文件中。使用File构造函数创建新的File对象。

const newFile = new File([csvDataWithSemicolons], 'new-file.csv', {
  type: 'text/csv',
  encoding: 'UTF-8',
});

代码示例

const reader = new FileReader();

reader.onload = function() {
  const csvData = reader.result;

  // 替换逗号分隔符为分号
  const csvDataWithSemicolons = csvData.replace(/,/g, ';');

  // 创建新文件
  const newFile = new File([csvDataWithSemicolons], 'new-file.csv', {
    type: 'text/csv',
    encoding: 'UTF-8',
  });

  // 保存新文件
  saveAs(newFile);
};

// 读取文件
reader.readAsText(file, 'UTF-8');