You can use the csvtojson
library to quickly convert CSV to JSON in JavaScript:
index.js
import csvToJson from 'csvtojson';
const csvFilePath = 'data.csv';
const json = await csvToJson().fromFile(csvFilePath);
const jsonString = JSON.stringify(json, null, 2)
console.log(jsonString);
For a data.csv
file like this:
color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2
This will be the resulting JSON:
[
{
"color": "red",
"maxSpeed": "120",
"age": "2"
},
{
"color": "blue",
"maxSpeed": "100",
"age": "3"
},
{
"color": "green",
"maxSpeed": "130",
"age": "2"
}
]
We use csvtojson
to convert the CSV into a JSON object, and use the JSON.stringify()
method to convert the object into a well-formatted JSON string.
Install csvtojson
Before using csvtojson
, you’ll need to install it in our project. You can do this with the NPM or Yarn CLI.
npm i csvtojson
# Yarn
yarn add csvtojson
After installation, you’ll be able to import it into a JavaScript module, like this:
import csvToJson from 'csvtojson';
// CommonJS
const csvToJson = require('csvtojson');
Convert CSV file to JSON with fromFile()
We call the default export function of the csvtojson
module to create the object that will convert the CSV. This object has a bunch of methods, each related in some way to the conversion of CSV to JSON, and fromFile()
is one of them.
It accepts the name of the CSV file to convert, and returns a Promise
, as the conversion is an asynchronous process. The Promise
will resolve with the resulting JSON string.
Convert CSV string to JSON with fromString()
To convert from a CSV data string directly, instead of a file, you can use the also asynchronous fromString()
method of the converter object instead:
import csvToJson from 'csvtojson';
const csv = `"First Name","Last Name","Age"
"Russell","Castillo",23
"Christy","Harper",35
"Eleanor","Mark",26`;
const json = await csvToJson().fromString(csv);
const jsonString = JSON.stringify(json, null, 2);
console.log(jsonString);
[
{
"First Name": "Russell",
"Last Name": "Castillo",
"Age": "23"
},
{
"First Name": "Christy",
"Last Name": "Harper",
"Age": "35"
},
{
"First Name": "Eleanor",
"Last Name": "Mark",
"Age": "26"
}
]
Customize conversion of CSV to JSON
The default export function of csvtojson
accepts an object used to specify options to customize the conversion process.
One such option is header
, an array used to specify the headers in the CSV data.
import csvToJson from 'csvtojson';
const csv = `"First Name","Last Name","Age"
"Russell","Castillo",23
"Christy","Harper",35
"Eleanor","Mark",26`;
const json = await csvToJson({
headers: ['firstName', 'lastName', 'age'],
}).fromString(csv);
console.log(json);
[
{
"firstName": "Russell",
"lastName": "Castillo",
"age": "23"
},
{
"firstName": "Christy",
"lastName": "Harper",
"age": "35"
},
{
"firstName": "Eleanor",
"lastName": "Mark",
"age": "26"
}
]
Another is delimeter
, used to indicate the character that separates the columns:
import csvToJson from 'csvtojson';
const csv = `"First Name"|"Last Name"|"Age"
"Russell"|"Castillo"|23
"Christy"|"Harper"|35
"Eleanor"|"Mark"|26`;
const json = await csvToJson({
headers: ['firstName', 'lastName', 'age'],
delimiter: '|',
}).fromString(csv);
const jsonString = JSON.stringify(json, null, 2);
console.log(jsonString);
[
{
"firstName": "Russell",
"lastName": "Castillo",
"age": "23"
},
{
"firstName": "Christy",
"lastName": "Harper",
"age": "35"
},
{
"firstName": "Eleanor",
"lastName": "Mark",
"age": "26"
}
]
We also have ignoreColumns
, an option that instructs the converter to ignore certain columns, using a regular expression.
import csvToJson from 'csvtojson';
const csv = `"First Name"|"Last Name"|"Age"
"Russell"|"Castillo"|23
"Christy"|"Harper"|35
"Eleanor"|"Mark"|26`;
const json = await csvToJson({
headers: ['firstName', 'lastName', 'age'],
delimiter: '|',
ignoreColumns: /lastName/,
}).fromString(csv);
const jsonString = JSON.stringify(json, null, 2);
console.log(jsonString);
[
{
"firstName": "Russell",
"age": "23"
},
{
"firstName": "Christy",
"age": "35"
},
{
"firstName": "Eleanor",
"age": "26"
}
]
Convert CSV to JSON array of rows
By setting the output
option to 'csv'
, we can produce a list of arrays, where each array represents a row, containing the value of all columns of that row.
For example:
import csvToJson from 'csvtojson';
const csv = `color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2`;
const json = await csvToJson({
output: 'csv',
}).fromString(csv);
const jsonString = JSON.stringify(json, null, 2);
console.log(jsonString);
[
[
"red",
"120",
"2"
],
[
"blue",
"100",
"3"
],
[
"green",
"130",
"2"
]
]
Native conversion of CSV to JSON
It’s also possible to convert CSV to JSON without using any third-party libraries.
function csvToJson(csv) {
// \n or \r\n depending on the EOL sequence
const lines = csv.split('\n');
const delimeter = ',';
const result = [];
const headers = lines[0].split(delimeter);
for (const line of lines) {
const obj = {};
const row = line.split(delimeter);
for (let i = 0; i < headers.length; i++) {
const header = headers[i];
obj[header] = row[i];
}
result.push(obj);
}
// Prettify output
return result;
}
const csv = `color,maxSpeed,age
red,120,2
blue,100,3
green,130,2`;
const json = csvToJson(csv);
const jsonString = JSON.stringify(json, null, 2);
console.log(jsonString);
You can modify the code above to allow for varying and more complex CSV data.
Output:
[
{
"color": "color",
"maxSpeed": "maxSpeed",
"age": "age"
},
{
"color": "red",
"maxSpeed": "120",
"age": "2"
},
{
"color": "blue",
"maxSpeed": "100",
"age": "3"
},
{
"color": "green",
"maxSpeed": "130",
"age": "2"
}
]
Every Crazy Thing JavaScript Does
A captivating guide to the subtle caveats and lesser-known parts of JavaScript.