JavaScript(Electron)でCSVファイルの読み込み、CSV→JSONの変換をスマートに行う

8041 ワード
JavaScript JSON Electron CSV JavaScript テキストリンク

#1 tl;dr

  • ElectronにてCSVのparseを行う時にcsv-parseモジュールを用いる
  • 使う機会はあまりないかもしれないが、CSVからJSONにいい感じにしてくれる

#2 install package

csv-parseモジュールはcsvモジュールに含まれる一つのモジュールであるため、
ただparseを行うだけであれば
$ npm install --save csv-parse
参考：csv.js.org

他のCSVファイルの操作(書き込みなど)も行いたい場合は以下をする
$ npm install --save csv

#3 読み込むCSV

今回はヘッダー付きのCSVファイルを用いる。
ヘッダー無しでも可能。

move_log.csv
time,x0,y0,x1,y1,x2,y2
0:00:00,0,0,10,20,20,40
0:00:01,0,0.1,10,20.1,20,39
0:00:02,0,0.2,10,20.2,20,38
0:00:03,0,0.3,10,20.3,20,37

#4 変換

  • 2行目のモジュールでerrorが出る場合(昔のversionを使う環境の場合)はrequireの部分をrequire("csv-parse")または"csv-parse"をimportしてください(2行目を消して3行目のコメントアウトを外してみて下さい)
const fs = require("fs");
const csv = require("csv-parse");
//const csv = require("csv-parse/lib/es5");

fs.createReadStream(__dirname + '/move_log.csv')
    .pipe(csv({
        columns: true //header無しのCSV fileはfalse
    }, function (err, data) {
        data = JSON.stringify(data);
        data = JSON.parse(data);

    console.log(data);

    }));

$ npm install --save csv
を行った人は以下となる

const fs = require("fs");
const csv = require("csv");

fs.createReadStream(__dirname + '/move_log.csv')
    .pipe(csv.parse({
        columns: true //header無しのCSV fileはfalse
    }, function (err, data) {
        data = JSON.stringify(data);
        data = JSON.parse(data);

    console.log(data);

    }));

#5 出力

[ { 'time': '0:00:00',
    x0: '0',
    y0: '0',
    x1: '10',
    y1: '20',
    x2: '20',
    y2: '40' },
  { 'time': '0:00:01',
    x0: '0',
    y0: '0.1',
    x1: '10',
    y1: '20.1',
    x2: '20',
    y2: '39' },
  { 'time': '0:00:02',
    x0: '0',
    y0: '0.2',
    x1: '10',
    y1: '20.2',
    x2: '20',
    y2: '38' },
  { 'time': '0:00:03',
    x0: '0',
    y0: '0.3',
    x1: '10',
    y1: '20.3',
    x2: '20',
    y2: '37' }]

#6 補足

  • Node.js
    • v10.11.0
  • npm
    • 5.2.0
  • electron
    • v4.1.4
『cプログラム設計言語』練習1-12
バックエンドフレームワークの構築-Velocityテンプレートエンジンの応用