在 JavaScript 中将 JSON 对象转换为 CSV 格式

IT技术 javascript arrays json csv
2021-03-17 06:15:13

我正在尝试将 JavaScript 对象集转换为 CSV 格式

如果您将其放入在线 JSON 解析器https://jsonformatter.org/json-parser，您可以了解我的 Javascript 对象

这就是我试图解决它的方式......但它失败了...... http://jsfiddle.net/fHQzC/11/

我正在尝试将与值“term”和相应标题相对应的整个值转换为 CSV 格式

的预期输出就像

Time,Dec 9, 2012 
News,Germany,election, Egypt,Revolution, Japan, Earthquake
Person,Obama, Beckham
Title,Pearce Snubs Beckham                                
Time,Dec 5, Birthday
Person, Lebron James
News,Italy,Euro 2012 Final
Title-Heats National Champions

是否可以在 Excel 表格中下载 csv 文件，我在 Stackoverflow 中找到的那个文件对我来说并不是很有用...

6个回答

你可以试试 

$(document).ready(function () {

        // Create Object
        var items = [
              { name: "Item 1", color: "Green", size: "X-Large" },
              { name: "Item 2", color: "Green", size: "X-Large" },
              { name: "Item 3", color: "Green", size: "X-Large" }];

        // Convert Object to JSON
        var jsonObject = JSON.stringify(items);

        // Display JSON
        $('#json').text(jsonObject);

        // Convert JSON to CSV & Display CSV
        $('#csv').text(ConvertToCSV(jsonObject));
    });

和一个函数 ConvertToCSV

// JSON to CSV Converter
        function ConvertToCSV(objArray) {
            var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
            var str = '';

            for (var i = 0; i < array.length; i++) {
                var line = '';
                for (var index in array[i]) {
                    if (line != '') line += ','

                    line += array[i][index];
                }

                str += line + '\r\n';
            }

            return str;
        }

来源

复杂性不会影响这一点，因为 csv 的格式将始终保持不变..
2021-04-17 06:15:13
这应该扩展为符合 RFC4180，特别是将可能包含逗号或换行符的双引号字符串括起来，并转义任何嵌入的双引号。见json2csv
2021-04-19 06:15:13
json 是逗号分隔值，它不会将逗号视为值。你需要为此使用一些技巧。
2021-04-20 06:15:13
2021-04-25 06:15:13
这会在值中包含逗号吗？
2021-05-06 06:15:13

这是我的解决方案

function arrayToCSV(objArray) {
     const array = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray;
     let str = `${Object.keys(array[0]).map(value => `"${value}"`).join(",")}` + '\r\n';

     return array.reduce((str, next) => {
         str += `${Object.values(next).map(value => `"${value}"`).join(",")}` + '\r\n';
         return str;
        }, str);
 }

例子：

let arr = [{name: "Essa", age: 25}];
console.log(arrayToCSV(arr));
@RisingSun 不，不是
2021-04-23 06:15:13
这会转义列内的逗号分隔值
2021-04-25 06:15:13

可能更优雅和最简单的解决方案

function convertToCSV(arr) {
  const array = [Object.keys(arr[0])].concat(arr)

  return array.map(it => {
    return Object.values(it).toString()
  }).join('\n')
}


console.log(
  convertToCSV(
    [
      {
        id: 1,
        name: 'Foo',
        timestamp: new Date()
      },
      {
        id: 2,
        name: 'Bar',
        timestamp: new Date()
      },
      {
        id: 3,
        name: 'Baz',
        timestamp: new Date()
      }
    ]
  )
)

谢谢，这正是我需要的解决方案。我相信这是最好的答案。
2021-04-19 06:15:13
这正是我要找的
2021-05-10 06:15:13
完美解决！
2021-05-17 06:15:13

这是一个类似于mightybruno's answer的解决方案，它处理包含逗号的字符串。其他答案似乎都没有考虑到这一点。

function objectsToCSV(arr) {
    const array = [Object.keys(arr[0])].concat(arr)
    return array.map(row => {
        return Object.values(row).map(value => {
            return typeof value === 'string' ? JSON.stringify(value) : value
        }).toString()
    }).join('\n')
}
非常感谢，我也看到很多答案没有考虑包含逗号的字符串。
2021-04-27 06:15:13

下面的代码会将 JSON 数组作为文件转换并下载到 csv。

 function exportJSONToCSV(objArray) {
    var arr = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray;
    var str =
      `${Object.keys(arr[0])
        .map((value) => `"${value}"`)
        .join(',')}` + '\r\n';
    var csvContent = arr.reduce((st, next) => {
      st +=
        `${Object.values(next)
          .map((value) => `"${value}"`)
          .join(',')}` + '\r\n';
      return st;
    }, str);
    var element = document.createElement('a');
    element.href = 'data:text/csv;charset=utf-8,' + encodeURI(csvContent);
    element.target = '_blank';
    element.download = 'export.csv';
    element.click();
  }
其它你可能感兴趣的问题
上一篇javascript 中的三元运算符、if-else 或逻辑 OR 是否更快？ 下一篇如何设置 Angular 4 背景图片？