如何在 JavaScript 中将 JSON 转换为 CSV

下面是我们如何在 JavaScript 中轻松地将 JSON 转换为 CSV：

 函数 jsonToCsv（项目）{  
 const header = Object.keys(items[0]); 常量 headerString = header.join(','); // 在此处处理空值或未定义值  
 const replacer = (key, value) => value ?? ''; 常量 rowItems = items.map((row) =>  
 标题  
 .map((fieldName) => JSON.stringify(row[fieldName], replacer))  
 。加入（'，'）  
 ); // 连接标题和正文，并分成单独的行  
 const csv = [headerString, ...rowItems].join('\r\n'); 返回.csv；  
 } 常量对象 = [  
 { 颜色：'红色'，最大速度：120，年龄：2 }，  
 { 颜色：“蓝色”，最大速度：100，年龄：3 }，  
 { 颜色：“绿色”，最大速度：130，年龄：2 }，  
 ]; 常量 csv = jsonToCsv(obj); 控制台.log(csv);

这将是 CSV 输出：

 颜色，最大速度，年龄  
 “红色”,120,2  
 “蓝色”,100,3  
 “绿色”,130,2

了解步骤

我们创建了一个可重复使用的 jsonToCsv() 函数让我们将多个 JSON 字符串转换为 CSV。它需要一个包含对象的数组。每个对象将在 CSV 输出中占据一行。

我们在此函数中所做的第一件事是获取将用于 CSV 标头的所有键。我们希望数组中的所有对象都有相同的键，所以我们使用 对象.keys() 方法将键从第一个对象项中提取到数组中。

 常量对象 = [  
 { 颜色：'红色'，最大速度：120，年龄：2 }，  
 { 颜色：“蓝色”，最大速度：100，年龄：3 }，  
 { 颜色：“绿色”，最大速度：130，年龄：2 }，  
 ]; // { color: 'red', maxSpeed: 120, age: 2 }  
 控制台.log(obj[0]); // ['颜色'，'maxSpeed'，'年龄']  
 console.log(Object.keys(obj[0]));

拿到钥匙后，我们调用 加入（） 数组上的方法将所有元素连接成 CSV 标头字符串。

 const header = ['color', 'maxSpeed', 'age']; const headerString = arr.join(','); console.log(headerString); // 颜色，最大速度，年龄

接下来，我们创建一个函数，该函数将作为回调传递给 替代品 的参数 JSON.stringify() 功能。该函数将处理 不明确的 或者 无效的 JSON 数组中对象的属性值。

 const obj = { prop1: '地球', prop2: undefined }; // 用空字符串 ('') 替换未定义的属性值  
 const replacer = (key, value) => value ?? ''; const str = JSON.stringify(obj, replacer); // {"prop1":"地球","prop2":""}  
 控制台.log(str);

然后我们使用 数组映射（） 从每个对象获取属性值的方法。 地图（） 接受一个在每个数组元素上调用的回调函数以返回一个转换。

此回调使用 标题 数组来获取每个对象的所有键。与另一个电话 地图（） ，它遍历每个键，获取对象中该键的对应值，并使用将其转换为字符串 JSON.stringify() .

这种内在的呼唤 地图（） 最终导致数组中当前对象的所有字符串化属性值的数组。

 const header = ['color', 'maxSpeed', 'age']; const row = { color: 'red', maxSpeed: 120, age: 2 }; const replacer = (key, value) => value ?? ''; 常量 rowItem = header.map((fieldName) =>  
 JSON.stringify（行[字段名]，替换）  
 ); // 字符串化的属性值数组  
 控制台.log(rowItem); // [ '"红色"', '120', '2' ]

将对象转换为属性值数组后， 加入（） 然后用于将数组转换为 CSV 行。

 ['"red"', '120', '2'].join(',') // -> "red",120,2

所以这个转换发生在 JSON 数组中的每个对象上，以生成一个 CSV 行列表，存储在 行项目 在我们原始示例中的变量。

为了生成最终的 CSV 输出，我们将 标头字符串 和 行项目 成一个数组，利用 传播语法 ( ... ）。

 const headerString = ['color', 'maxSpeed', 'age']; const rowItems = ['"red",120,2', '"blue",100,3', '"green",130,2']; [headerString, ...rowItems];  
 /*  
 输出->  
 [  
 ['颜色'，'maxSpeed'，'年龄']，  
 '"红色",120,2',  
 '"蓝色",100,3',  
 '“绿色”,130,2'  
 ]  
 */

然后我们调用 加入（） 在这个数组上 '\r\n' string 作为分隔符，创建一个带有 CSV 标题的字符串，并且每个 CSV 行位于单独的行中。

 const headerString = ['color', 'maxSpeed', 'age']; const rowItems = ['"red",120,2', '"blue",100,3', '"green",130,2']; console.log([headerString, ...rowItems].join('\r\n'));  
 /*  
 颜色，最大速度，年龄  
 “红色”,120,2  
 “蓝色”,100,3  
 “绿色”,130,2  
 */

最初发表于 编码beautydev.com

JavaScript 所做的每一件疯狂的事

关于 JavaScript 的细微警告和鲜为人知的部分的迷人指南。

注册 并立即获得免费副本。

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/11168/29580210