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,2This 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 csvtojsonAfter 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"
}
]11 Amazing New JavaScript Features in ES13
This guide will bring you up to speed with all the latest features added in ECMAScript 13. These powerful new features will modernize your JavaScript with shorter and more expressive code.
