如何将JSON转换为CSV格式并存储在variables中
我有一个链接,在浏览器中打开JSON数据,但不幸的是,我不知道如何阅读它。 有没有办法使用javascript逗号分隔( csv )格式转换此数据,并将其保存在一个JavaScriptvariables。 我刚刚开始学习,对json完全没有任何线索,如果有人可以为它写一个脚本,那将是非常棒的。
数据如下所示:
{ "count": 2, "items": [{ "title": "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)", "description": "Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China\u2019s capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store\u2019s security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone", "link": "http:\/\/wik.io\/info\/US\/309201303", "timestamp": 1326439500, "image": null, "embed": null, "language": null, "user": null, "user_image": null, "user_link": null, "user_id": null, "geo": null, "source": "wikio", "favicon": "http:\/\/wikio.com\/favicon.ico", "type": "blogs", "domain": "wik.io", "id": "2388575404943858468" }, { "title": "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)", "description": "SHANGHAI \u2013 Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone", "link": "http:\/\/wik.io\/info\/US\/309198933", "timestamp": 1326439320, "image": null, "embed": null, "language": null, "user": null, "user_image": null, "user_link": null, "user_id": null, "geo": null, "source": "wikio", "favicon": "http:\/\/wikio.com\/favicon.ico", "type": "blogs", "domain": "wik.io", "id": "16209851193593872066" }] }
我能find的最接近的是: 为MS Excel转换JSON格式为CSV格式
但是在CSV
文件下载,我把它存储在一个variables,整个转换的数据。
还想知道如何改变转义字符: '\u2019'
恢复正常。
提前致谢。
我试过这个代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JSON to CSV</title> <script src="http://code.jquery.com/jquery-1.7.1.js" type="text/javascript"></script> <script type="text/javascript"> var json3 = { "count": 2, "items": [{ "title": "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)", "description": "Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China's capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store's security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone", "link": "http://wik.io/info/US/309201303", "timestamp": 1326439500, "image": null, "embed": null, "language": null, "user": null, "user_image": null, "user_link": null, "user_id": null, "geo": null, "source": "wikio", "favicon": "http://wikio.com/favicon.ico", "type": "blogs", "domain": "wik.io", "id": "2388575404943858468" }, { "title": "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)", "description": "SHANGHAI – Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone", "link": "http://wik.io/info/US/309198933", "timestamp": 1326439320, "image": null, "embed": null, "language": null, "user": null, "user_image": null, "user_link": null, "user_id": null, "geo": null, "source": "wikio", "favicon": "http://wikio.com/favicon.ico", "type": "blogs", "domain": "wik.io", "id": "16209851193593872066" } ] } //var objJson = JSON.parse(json3.items); DownloadJSON2CSV(json3.items); function DownloadJSON2CSV(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]) { line += array[i][index] + ','; } line.slice(0, line.Length - 1); str += line + '\r\n'; } $('div').html(str); } </script> </head> <body> <div></div> </body> </html>
但似乎没有工作。 有人可以帮忙吗?
好吧,我终于得到这个代码工作:
<html> <head> <title>Demo - Covnert JSON to CSV</title> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" src="https://github.com/douglascrockford/JSON-js/raw/master/json2.js"></script> <script type="text/javascript"> // 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; } // Example $(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)); }); </script> </head> <body> <h1> JSON</h1> <pre id="json"></pre> <h1> CSV</h1> <pre id="csv"></pre> </body> </html>
非常感谢所有的贡献者的支持。
Praney
将json转换为csv的更优雅的方法是使用map函数,而不使用任何框架:
var json = json3.items var fields = Object.keys(json[0]) var replacer = function(key, value) { return value === null ? '' : value } var csv = json.map(function(row){ return fields.map(function(fieldName){ return JSON.stringify(row[fieldName], replacer) }).join(',') }) csv.unshift(fields.join(',')) // add header column console.log(csv.join('\r\n'))
输出:
title,description,link,timestamp,image,embed,language,user,user_image,user_link,user_id,geo,source,favicon,type,domain,id "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)","Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China's capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store's security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone","http://wik.io/info/US/309201303","1326439500","","","","","","","","","wikio","http://wikio.com/favicon.ico","blogs","wik.io","2388575404943858468" "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)","SHANGHAI – Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone","http://wik.io/info/US/309198933","1326439320","","","","","","","","","wikio","http://wikio.com/favicon.ico","blogs","wik.io","16209851193593872066"
更新ES6(2016)
使用这种不太密集的语法,也可以使用JSON.stringify在保持数字不加引号的情况下向引号添加引号:
const items = json3.items const replacer = (key, value) => value === null ? '' : value // specify how you want to handle null values here const header = Object.keys(items[0]) let csv = items.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(',')) csv.unshift(header.join(',')) csv = csv.join('\r\n') console.log(csv)
由praneybehl非常好的解决scheme,但如果有人想要将数据保存为csv
文件,并使用blob
方法,那么他们可以参考:
function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel) { //If JSONData is not an object then JSON.parse will parse the JSON string in an Object var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData; var CSV = ''; //This condition will generate the Label/Header if (ShowLabel) { var row = ""; //This loop will extract the label from 1st index of on array for (var index in arrData[0]) { //Now convert each value to string and comma-seprated row += index + ','; } row = row.slice(0, -1); //append Label row with line break CSV += row + '\r\n'; } //1st loop is to extract each row for (var i = 0; i < arrData.length; i++) { var row = ""; //2nd loop will extract each column and convert it in string comma-seprated for (var index in arrData[i]) { row += '"' + arrData[i][index] + '",'; } row.slice(0, row.length - 1); //add a line break after each row CSV += row + '\r\n'; } if (CSV == '') { alert("Invalid data"); return; } //this trick will generate a temp "a" tag var link = document.createElement("a"); link.id="lnkDwnldLnk"; //this part will append the anchor tag and remove it after automatic click document.body.appendChild(link); var csv = CSV; blob = new Blob([csv], { type: 'text/csv' }); var csvUrl = window.webkitURL.createObjectURL(blob); var filename = 'UserExport.csv'; $("#lnkDwnldLnk") .attr({ 'download': filename, 'href': csvUrl }); $('#lnkDwnldLnk')[0].click(); document.body.removeChild(link); }
如果你碰巧在你的项目中使用D3,那么你可以简单地调用:
d3.csv.format
或d3.csv.formatRows
函数将对象数组转换为csvstring。
d3.csv.formatRows
使您可以更好地控制将哪些属性转换为csv。
请参阅d3.csv.format和d3.csv.formatRows wiki页面。
写Csv。
function writeToCsv(dataToWrite, callback) { var dataToWrite; var fs = require('fs'); dataToWrite = convertToCSV(dataToWrite); fs.writeFile('assets/distanceInfo.csv', dataToWrite, 'utf8', function (err) { if (err) { console.log('Some error occured - file either not saved or corrupted file saved.'); } else{ console.log('It\'s saved!'); } callback("data_saved | assets/distanceInfo.csv") }); } 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; }