web-dev-qa-db-ja.com

JavaScriptを使用してCSVデータをJSON形式に変換する

CSV形式のデータがあり、JavaScriptを使用してJSON形式に変換したい。

以下はcsv形式です。

[Test.csv] 
id;name;author
integer;string;authors:n
1;To Kill an Angry Bird;1

[authors.csv] 
id;name
integer;string
1;Harper Lee
2;JRR Tolkien
3;William Shakespeare

著者と一緒にすべての本を手に入れたいです。それでは、JavaScriptを使用してどのように実装できますか？.

javascriptjqueryasp.net-mvc-4
19
Pankaj

以下はあなたのために働くべきです。

すべてのクレジット http://techslides.com/convert-csv-to-json-in-javascript

//var csv is the CSV file with headers
function csvJSON(csv){

  var lines=csv.split("\n");

  var result = [];

  // NOTE: If your columns contain commas in their values, you'll need
  // to deal with those before doing the next step 
  // (you might convert them to &&& or something, then covert them back later)
  // jsfiddle showing the issue https://jsfiddle.net/
  var headers=lines[0].split(",");

  for(var i=1;i<lines.length;i++){

      var obj = {};
      var currentline=lines[i].split(",");

      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
}
27
Wesley Smith

私はチェックアウトします PapaParse 。 papaparse.min.jsというファイルがあり、必要に応じてプロジェクトにドロップできます。 PapaParseには依存関係はありません。

私はそれを自分で使用し、動作することを確認でき、便利で、十分に文書化されています。

6
mareoraft

@ DelightedD0Dに基づいて、if (!lines[i]) continueを追加して、空の行と後続の行を無視できるようにします。

function csvJSON(csv) {
    const lines = csv.split('\n')
    const result = []
    const headers = lines[0].split(',')

    for (let i = 1; i < lines.length; i++) {        
        if (!lines[i])
            continue
        const obj = {}
        const currentline = lines[i].split(',')

        for (let j = 0; j < headers.length; j++) {
            obj[headers[j]] = currentline[j]
        }
        result.Push(obj)
    }
    return result
}
1
foxiris

@ DelightedD0Dのような同様の答えがありますが、コードをExcelと直接組み合わせて使用​​できます（Excelからテキストエリアにコピーして貼り付けます）。

function csvUpload(csvText){
        //Split all the text into seperate lines on new lines and carriage return feeds
        var allTextLines = csvText.split(/\r\n|\n/);
        //Split per line on tabs and commas
        var headers = allTextLines[0].split(/\t|,/);
        var lines = [];
        var locations = [];

        for (var i=1; i<allTextLines.length; i++) {
            var data = allTextLines[i].split(/\t|,/);

            if (data.length == headers.length) {

            var location = {"device_id":data[0], "address":data[1], "city":data[2]};
            locations.Push(location);

            }

        }
        return locations;
    }

これにより、ExcelにコピーされたCSVを使用できます。 Excelは,などの区切り文字を削除し、改行などを挿入します。

私のコードを使用すると、すべてをExcelから直接テキストフィールドに渡し、それを使用してjsonを作成できます。

ここではフィールドの名前を静的にしていますが、@ DelightedD0Dのコードを使用してヘッダーを動的に設定できます。

 for(var j=0;j<headers.length;j++){
          obj[headers[j]] = currentline[j];
      }
0
VeldMuijz

私はより良い解決策があると思いますが、これには1つの問題があります。つまり、値にコンマ（、）を含めないでください。それ以外の場合は、それが最善の解決策です。

 // convert csv to json
csvJSON(csvText) {
let lines = [];
const linesArray = csvText.split('\n');
// for trimming and deleting extra space 
linesArray.forEach((e: any) => {
    const row = e.replace(/[\s]+[,]+|[,]+[\s]+/g, ',').trim();
    lines.Push(row);
});
// for removing empty record
lines.splice(lines.length - 1, 1);
const result = [];
const headers = lines[0].split(",");

for (let i = 1; i < lines.length; i++) {

    const obj = {};
    const currentline = lines[i].split(",");

    for (let j = 0; j < headers.length; j++) {
    obj[headers[j]] = currentline[j];
    }
    result.Push(obj);
}
//return result; //JavaScript object
// return JSON.stringify(result); //JSON
return result;
}

// For Reading CSV File
readCSV(event) {
const reader = new FileReader();
reader.readAsText(event.files[0]);
reader.onload = () => {
    const text = reader.result;
    const csvToJson = this.csvJSON(text);
    console.log(csvToJson);
};
}

ありがとうございました

0
Sohel Siddiki