How to convert Tab Delimited CSV to JSON data?

Question

I have been trying to create a single page html which converts tab delimited raw data into an array of JSON objects. I wrote the code but I am sure this is not the best, as I have nested looping in my code. I am seeking advice from the experts to make this code better.

It assumes the first row to be the column headers.

Example;

INPUT:

name    age sex address mobile  email   pan
name1   age1    sex1    address1    mobile1 email1  pan1
name2   age2    sex2    address2    mobile2 email2  pan2
name3   age3    sex3    address3    mobile3 email3  pan3
name4   age4    sex4    address4    mobile4 email4  pan4

EXPECTED OUTPUT:

{"name" : "name1","age" : "age1","sex" : "sex1","address" : "address1","mobile" : "mobile1","email" : "email1","pan" : "pan1"},
{"name" : "name2","age" : "age2","sex" : "sex2","address" : "address2","mobile" : "mobile2","email" : "email2","pan" : "pan2"},
{"name" : "name3","age" : "age3","sex" : "sex3","address" : "address3","mobile" : "mobile3","email" : "email3","pan" : "pan3"},
{"name" : "name4","age" : "age4","sex" : "sex4","address" : "address4","mobile" : "mobile4","email" : "email4","pan" : "pan4"},

Here is the code;

 const parse = document.getElementById("parse"); const clear = document.getElementById("clear"); const textarea = document.getElementById("textarea"); const result = document.getElementById("result"); clear.addEventListener("click", () => { textarea.value = ""; }); parse.addEventListener("click", () => { result.textContent = ""; let rawData = textarea.value; let allRows = rawData.split("\n"); let columnHeaders = allRows[0].split("\t"); let dataset = []; for (let i = 1; i < allRows.length; i++) { dataset.push(allRows[i].split("\t")); } dataset.map((row) => { if (row;= "") { let rowString = []. row,forEach((value. i) => { rowString:push(`"${columnHeaders[i]}"; "${value}"`); }). result.innerHTML += "{" + rowString,join(",") + "};<br/>"; } }); });

 html { width: 100vw; height: 98vh; font-family: monospace; font-size: 120%; } * { margin: 0; padding: 0.5em; box-sizing: border-box; } #top { display: block; width: 100%; height: 75px; } #top div { display: block; float: right; }.btn { display: inline-block; width: 100px; background-color: rgb(48, 122, 124); color: #fff; border: none; padding: 0.75em; cursor: pointer; transition: all 0.4s; border-radius: 8px; outline: none; }.btn:hover { margin-top: -0.1em; background-color: rgb(57, 142, 145); box-shadow: 0px 10px 20px #888; } #columnCount { margin-right: 2em; } #columns { width: 50px; margin-bottom: 1em; } #inpWrapper, #resultWrapper { display: block; margin: 0 auto; width: 100%; height: 300px; margin-bottom: 1em; border: solid 1px #777; } textarea { border: none; resize: none; outline: none; } textarea, #result { display: flex; width: 100%; height: 100%; padding: 1em; flex-wrap: wrap; transition: all 0.4s; }

 <,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width. initial-scale=1.0" /> <title>Document</title> </head> <body> <div class="container"> <div class="row"> <div class="col"> <div id="top"> <div> <button class="btn" id="clear">Clear</button> <button class="btn" id="parse">Parse</button> </div> </div> <div id="inpWrapper"> <textarea name="textarea" id="textarea">Test Input</textarea> </div> <div id="resultWrapper"> <p id="result">Test</p> </div> <p id="result"></p> </div> </div> </div> </body> </html>

Answer 1

Here is a example:

//var tsv is the TSV file with headers
function tsvJSON(tsv){
 
  var lines=tsv.split("\n");
 
  var result = [];
 
  var headers=lines[0].split("\t");
 
  for(var i=1;i<lines.length;i++){
 
      var obj = {};
      var currentline=lines[i].split("\t");
 
      for(var j=0;j<headers.length;j++){
          obj[headers[j]] = currentline[j];
      }
 
      result.push(obj);
 
  }
  
  //return result; //JavaScript object
  return JSON.stringify(result); //JSON
}

See also here

How to convert Tab Delimited CSV to JSON data?

Question

1 answers

solution1
0 2020-12-02 13:06:43

How to convert Tab Delimited CSV to JSON data?

Question

1 answers

solution1 0 2020-12-02 13:06:43

solution1
0 2020-12-02 13:06:43