JS导出文件|极客笔记

JS导出文件

在开发前端应用程序时，经常会遇到需要将数据导出为文件的情况。在JavaScript中，我们可以通过一些库或者原生方法来实现文件导出。本文将详细介绍如何使用JavaScript导出文件，包括文本文件、CSV文件、Excel文件等格式。

导出文本文件

首先我们来看如何导出文本文件。我们可以通过使用Blob对象来创建一个包含文本内容的文件，并通过URL.createObjectURL()方法生成下载链接，最后通过a标签的download属性来触发下载。

function exportTextFile() {
  const content = "这是要导出的文本内容";

  const blob = new Blob([content], { type: "text/plain" });
  const url = URL.createObjectURL(blob);

  const a = document.createElement("a");
  a.href = url;
  a.download = "exported_text_file.txt";
  a.click();
}

执行exportTextFile()函数后，将生成一个名为exported_text_file.txt的文本文件，并自动下载到本地。

导出CSV文件

导出CSV文件也是常见的需求，我们可以将数据转换为CSV格式的字符串，然后通过Blob对象导出。

function exportCsvFile() {
  const data = [
    ["Name", "Age", "Country"],
    ["Alice", 25, "USA"],
    ["Bob", 30, "Canada"],
    ["Charlie", 22, "UK"]
  ];

  let csvContent = "data:text/csv;charset=utf-8,";
  data.forEach(row => {
    csvContent += row.join(",") + "\n";
  });

  const blob = new Blob([csvContent], { type: "text/csv" });
  const url = URL.createObjectURL(blob);

  const a = document.createElement("a");
  a.href = url;
  a.download = "exported_csv_file.csv";
  a.click();
}

执行exportCsvFile()函数后，将生成一个名为exported_csv_file.csv的CSV文件，并自动下载到本地。

导出Excel文件

导出Excel文件可以使用一些开源的库，例如XLSX。该库提供了丰富的API，用于生成和处理Excel文件。

首先，我们需要引入XLSX库：

<script src="https://cdn.jsdelivr.net/npm/xlsx@0.17.2/dist/xlsx.full.min.js"></script>

然后，我们可以使用XLSX库来生成Excel文件：

function exportExcelFile() {
  const data = [
    ["Name", "Age", "Country"],
    ["Alice", 25, "USA"],
    ["Bob", 30, "Canada"],
    ["Charlie", 22, "UK"]
  ];

  const ws = XLSX.utils.aoa_to_sheet(data);
  const wb = XLSX.utils.book_new();
  XLSX.utils.book_append_sheet(wb, ws, "Sheet1");

  const wbout = XLSX.write(wb, { bookType: "xlsx", type: "array" });
  const blob = new Blob([wbout], { type: "application/octet-stream" });
  const url = URL.createObjectURL(blob);

  const a = document.createElement("a");
  a.href = url;
  a.download = "exported_excel_file.xlsx";
  a.click();
}

执行exportExcelFile()函数后，将生成一个名为exported_excel_file.xlsx的Excel文件，并自动下载到本地。