引言
在数据处理和导出方面，JSON 和 CSV 格式是两个常见的角色。JSON（JavaScript Object Notation）以其良好的可读性和灵活性被广泛应用于数据存储和传输，而CSV（Comma-Separated Values）则因其简洁易读、方便导入到各种表格软件中而深受欢迎。今天，我们将介绍如何在纯 JavaScript 中，利用开源库 @json2csv/plainjs 轻松实现从 JSON 转换到 CSV，帮助你高效处理数据。
一、什么是 @json2csv/plainjs？
@json2csv/plainjs 是 json2csv 的一种轻量版（纯原生 JS 实现），无需依赖任何第三方库或环境（比如 Node.js 特定模块），非常适合浏览器或纯 JS 环境下使用。
主要功能：
- 将 JSON 对象或数组转换成 CSV 格式
- 支持自定义字段和格式
- 简单易用，无复杂配置
二、基础用法：将简单 JSON 转为 CSV
示例：转换一组用户数据
import { Parser } from '@json2csv/plainjs';
// 示例数据
const myData = [
{ name: 'John', age: 30, city: 'New York' },
{ name: 'Jane', age: 25, city: 'Los Angeles' },
{ name: 'Doe', age: 35, city: 'Chicago' }
];
// 基本转换示例
try {
const basicOpts = {};
const basicParser = new Parser(basicOpts);
const basicCsv = basicParser.parse(myData);
console.log('基本转换结果:');
console.log(basicCsv);
} catch (err) {
console.error('基本转换出错:', err);
}
输出：
"name","age","city"
"John",30,"New York"
"Jane",25,"Los Angeles"
"Doe",35,"Chicago"
说明
-
parse() 方法将数组中的每个对象作为一行
- 默认会提取所有对象的所有键作为字段名
三、定制转换：选择特定字段
我们可以通过 fields 选项，指定输出哪些字段，保证输出内容的可控性。
示例：只导出 name 和 email
import { Parser } from '@json2csv/plainjs';
const users = [
{ name: 'Alice', age: 30, email: 'alice@example.com' },
{ name: 'Bob', age: 25, email: 'bob@example.com' }
];
const customOpts = { fields: ['name', 'email'] };
const customParser = new Parser(customOpts);
const csv = customParser.parse(users);
console.log(csv);
输出：
name,email
Alice,alice@example.com
Bob,bob@example.com
说明
四、深入：使用复杂参数定制格式
@json2csv/plainjs 提供多种选项，帮助你控制输出格式。
1. 自定义字段标题
import { Parser } from '@json2csv/plainjs';
const users = [
{ name: 'Alice', age: 30, email: 'alice@example.com' },
{ name: 'Bob', age: 25, email: 'bob@example.com' }
];
const fields = [
{ label: '姓名', value: 'name' },
{ label: '年龄', value: 'age' }
];
const customOpts = { fields };
const customParser = new Parser(customOpts);
const csv = customParser.parse(users);
console.log(csv);
输出：
姓名,年龄
Alice,30
Bob,25
2. 添加换行符和其他格式控制
除了基本功能，你还可以通过选项调整字段分隔符、换行符等。
import { Parser } from '@json2csv/plainjs';
const users = [
{ name: 'Alice', age: 30, email: 'alice@example.com' },
{ name: 'Bob', age: 25, email: 'bob@example.com' }
];
const fields = [
{ label: '姓名', value: 'name' },
{ label: '年龄', value: 'age' }
];
const options = {
fields,
delimiter: ';', // 使用分号作为字段分隔符
eol: '\r\n' // 换行符使用 Windows 风格
};
const customParser = new Parser(options);
const csv = customParser.parse(users);
console.log(csv);
五、实战案例：导出嵌套JSON
假设你的 JSON 中包含嵌套对象，如何处理？
import { Parser } from '@json2csv/plainjs';
const data = [
{
id: 1,
name: 'Alice',
address: { city: 'Beijing', street: 'Chao Yang' }
},
{
id: 2,
name: 'Bob',
address: { city: 'Shanghai', street: 'Pudong' }
}
];
// 通过指定字段的路径，将嵌套对象扁平化
const fields = [
{ label: 'ID', value: 'id' },
{ label: '名称', value: 'name' },
{ label: '城市', value: 'address.city' },
{ label: '街道', value: 'address.street' }
];
const customParser = new Parser({fields});
const csv = customParser.parse(data);
console.log(csv);
输出：
ID,名称,城市,街道
1,Alice,Beijing,Chao Yang
2,Bob,Shanghai,Pudong
结语
如果你喜欢本教程，记得点赞+收藏！关注我获取更多JavaScript开发干货。
登录