前端新手指南：如何解决JavaScript导出CSV文件不完整的问题

在JavaScript中处理CSV文件时，需要特别注意一些特殊字符，例如逗号、双引号、换行符等。这些字符可能会影响CSV文件的解析，导致数据错乱。

1. 逗号 (,)

逗号是CSV文件默认的列分隔符。如果数据字段中包含逗号，需要将该字段用双引号包围起来。

const data = ['Hello, world', 'Example'];
const csv = data.map(item => `"${item}"`).join(',');
console.log(csv); // "Hello, world","Example"

2. 双引号 (")

双引号用于包围包含特殊字符的字段。如果字段内容中包含双引号，需要将其替换为两个连续的双引号 ("")。

const data = ['He said "Hello"', 'Example'];
const csv = data.map(item => `"${item.replace(/"/g, '""')}"`).join(',');
console.log(csv); // "He said ""Hello""","Example"

3. 换行符 (\n) 和回车符 (\r)

换行符和回车符分别表示换行。如果数据字段中包含换行符或回车符，需要将该字段用双引号包围起来。

const data = ['First line\nSecond line', 'Example'];
const csv = data.map(item => `"${item}"`).join(',');
console.log(csv); // "First line\nSecond line","Example"

4. 制表符 (\t)

制表符在CSV文件中通常不会被识别为列分隔符。但是，如果CSV文件使用制表符作为分隔符，那么我们就需要将数据字段中的制表符替换为其他字符，或者将包含制表符的字段用双引号包围起来。

const data = ['Column1\tColumn2', 'Example'];
const csv = data.map(item => `"${item}"`).join(',');
console.log(csv); // "Column1\tColumn2","Example"

5. 特殊控制字符

控制字符是指一些非打印字符，例如退格符 (\b)、换页符 (\f) 等。在处理CSV文件时，需要确保正确处理这些特殊控制字符，避免解析错误。

const data = ['Line1\fLine2', 'Example'];
const csv = data.map(item => `"${item}"`).join(',');
console.log(csv); // "Line1\fLine2","Example"

6. 非ASCII字符

非ASCII字符是指 ASCII 码表中未定义的字符，例如中文、日文、韩文等。在处理包含非ASCII字符的CSV文件时，需要确保使用正确的字符编码。如果是中文建议使用UTF-8 BOM防止中文乱码，只是使用utf-8依旧可能出现问题。

const data = ['你好', 'Example'];
const csv = data.map(item => `"${item}"`).join(',');
console.log(csv); // "你好","Example"

7. 井号 (#)

在CSV文件的标准内容中，井号通常没有特殊意义，可以作为普通字符出现在数据字段中。但是，一些应用程序或数据处理流程可能会对井号有特殊处理，例如将其视为注释符号。

在Excel中，如果单元格内容因列宽不足无法完全显示，会用井号（#######）来表示。这不是CSV文件本身的问题，通过调整列宽即可解决。这也是要注意的地方。

代码示例：处理CSV中的特殊字符

最后给大家一段处理特殊字符的代码示例：

function escapeCsvField(field) {
    if (field.includes('"')) {
        field = field.replace(/"/g, '""');
    }
    if (field.includes(',') || field.includes('\n') || field.includes('\r')) {
        field = `"${field}"`;
    }
    return field;
}

const data = [
    ['Name', 'Message'],
    ['John Doe', 'Hello, "world"!'],
    ['Jane Doe', 'Line1\nLine2']
];

const csv = data.map(row => row.map(escapeCsvField).join(',')).join('\n');
console.log(csv);
// Name,Message
// John Doe,"Hello, ""world""!"
// Jane Doe,"Line1
// Line2"

文章转自：https://juejin.cn/post/7379884876722028584