JSON to CSV using JavaScript
This is a way to convert a JSON object to a CSV file using only JavaScript.
We download the CSV file using the DOM method and allow the entires of results to have different number of headers. We assume that while each result object can have different number of headers the entry with the most number of headers contain all the possible headers in the results array.
A follow up feature enchancement to do with this program is to store the headers in a map so we can fully support as many headers as possible.
Sample JSON:
{ "results": [
{
"id": "8675309",
...
}
] }
Code:
function convert() {
var json = $("#_json").val();
if(json == '')
return;
json = JSON.parse(json).results;
// Find the largest element
var largestEntry = 0;
var header;
for(var i=0; i<json.length; i++){
if (!Object.keys) {
Object.keys = function(obj) {
var keys = [];
for (var i in obj) {
if (obj.hasOwnProperty(i)) {
keys.push(i);
}
}
return keys;
};
}
if(Object.keys(json[i]).length > largestEntry){
largestEntry = Object.keys(json[i]).length;
header = Object.keys(json[i]);
}
};
// Assemble the header
var convertedjson = "";
if (typeof Array.prototype.forEach != 'function') {
Array.prototype.forEach = function(callback){
for (var i = 0; i < this.length; i++){
callback.apply(this, [this[i], i, this]);
}
};
}
header.forEach(function(heading){
if(convertedjson != "") {
convertedjson += ",";
}
convertedjson += "\"";
convertedjson += heading
convertedjson += "\"";
});
convertedjson += "\r\n";
// Iterate through the header for all elements
json.forEach(function(entry){
header.forEach(function(heading){
convertedjson += "\"";
convertedjson += (entry[heading] || "");
convertedjson += "\"";
convertedjson += ",";
});
convertedjson = convertedjson.substring(0, convertedjson.length - 1);
convertedjson += "\r\n";
});
$("#_csv").val(convertedjson);
}
function convertAndExport() {
convert();
var csv = $("#_csv").val();
if(csv == '')
return;
// Exporting
var months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var now = new Date();
var date = now.getDate();
var year = now.getFullYear();
var month = months[now.getMonth()];
var fileName = "CSV"+year+month+date;
var uri = 'data:text/csv;charset=utf-8,' + escape(csv);
var link = document.createElement("a");
$(link).hide();
link.href = uri;
link.download = fileName + ".csv";
$("body").append(link);
link.click();
$("body").remove(link);
}