Как преобразовать CSV в массив в JavaScript

Вы можете использовать библиотеку csvtojson для быстрого преобразования CSV-файла или строки в массив объектов в JavaScript:

index.js

import csvToJson from 'csvtojson';

const csvFilePath = 'data.csv';

const array = await csvToJson().fromFile(csvFilePath);
console.log(array);

Для такого файла data.csv:

data.csv

color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2

Это будет результирующий массив:

Output

[
  { color: 'red', maxSpeed: '120', age: '2' },
  { color: 'blue', maxSpeed: '100', age: '3' },
  { color: 'green', maxSpeed: '130', age: '2' }
]

Установить csvtojson

Прежде чем использовать csvtojson, вам необходимо установить его в свой проект. Вы можете сделать это с помощью NPM или Yarn CLI.

npm i csvtojson

# Yarn
yarn add csvtojson

После установки вы сможете импортировать его в модуль JavaScript, например:

import csvToJson from 'csvtojson';

// CommonJS
const csvToJson = require('csvtojson');

Преобразование файла CSV в массив с помощью fromFile()

Мы вызываем функцию экспорта по умолчанию модуля csvtojson, чтобы создать объект, который преобразует CSV в массив. У этого объекта есть множество методов, каждый из которых так или иначе связан с преобразованием CSV в объект JavaScript, и fromFile() — один из них.

Он принимает имя CSV-файла для преобразования и возвращает Promise, поскольку преобразование является асинхронным процессом. Promise будет разрешено с результирующей строкой JSON.

Преобразование строки CSV в массив с помощью fromString()

Чтобы преобразовать строку данных CSV напрямую, а не из файла, вы можете использовать также асинхронный метод fromString() объекта преобразователя:

index.js

import csvToJson from 'csvtojson';

const csv = `"First Name","Last Name","Age"
"Russell","Castillo",23
"Christy","Harper",35
"Eleanor","Mark",26`;
const array = await csvToJson().fromString(csv);
console.log(array);

Output

[
  { 'First Name': 'Russell', 'Last Name': 'Castillo', Age: '23' },
  { 'First Name': 'Christy', 'Last Name': 'Harper', Age: '35' },
  { 'First Name': 'Eleanor', 'Last Name': 'Mark', Age: '26' }
]

Настроить преобразование CSV в массив

Функция экспорта по умолчанию csvtojson принимает объект, используемый для указания параметров для настройки процесса преобразования.

Одним из таких параметров является header, массив, используемый для указания заголовков в данных CSV.

index.js

import csvToJson from 'csvtojson';

const csv = `"First Name","Last Name","Age"
"Russell","Castillo",23
"Christy","Harper",35
"Eleanor","Mark",26`;
const array = await csvToJson({
  headers: ['firstName', 'lastName', 'age'],
}).fromString(csv);
console.log(array);

Output

[
  { firstName: 'Russell', lastName: 'Castillo', age: '23' },
  { firstName: 'Christy', lastName: 'Harper', age: '35' },
  { firstName: 'Eleanor', lastName: 'Mark', age: '26' }
]

Другой — delimeter, используемый для обозначения символа, разделяющего столбцы:

import csvToJson from 'csvtojson';

const csv = `"First Name"|"Last Name"|"Age"
"Russell"|"Castillo"|23
"Christy"|"Harper"|35
"Eleanor"|"Mark"|26`;
const array = await csvToJson({
  headers: ['firstName', 'lastName', 'age'],
  delimiter: '|',
}).fromString(csv);

Output

[
  { firstName: 'Russell', lastName: 'Castillo', age: '23' },
  { firstName: 'Christy', lastName: 'Harper', age: '35' },
  { firstName: 'Eleanor', lastName: 'Mark', age: '26' }
]

У нас также есть ignoreColumns, параметр, который указывает конвертеру игнорировать определенные столбцы, используя регулярное выражение.

import csvToJson from 'csvtojson';

const csv = `"First Name"|"Last Name"|"Age"
"Russell"|"Castillo"|23
"Christy"|"Harper"|35
"Eleanor"|"Mark"|26`;
const array = await csvToJson({
  headers: ['firstName', 'lastName', 'age'],
  delimiter: '|',
  ignoreColumns: /lastName/,
}).fromString(csv);
console.log(array);

Output

[
  { firstName: 'Russell', age: '23' },
  { firstName: 'Christy', age: '35' },
  { firstName: 'Eleanor', age: '26' }
]

Преобразование CSV в массив строк

Установив для параметра output значение 'csv', мы можем создать список массивов, где каждый массив представляет строку, содержащую значения всех столбцов этой строки.

Например:

index.js

import csvToJson from 'csvtojson';

const csv = `color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2`;
const array = await csvToJson({
  output: 'csv',
}).fromString(csv);
console.log(array);

Output

[
  [ 'red', '120', '2' ],
  [ 'blue', '100', '3' ],
  [ 'green', '130', '2' ]
]

Собственное преобразование CSV в массив

Также возможно преобразовать CSV в массив JavaScript без использования каких-либо сторонних библиотек.

index.js

function csvToArray(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 JSON.stringify(result, null, 2);
}
const csv = `color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2`;
const array = csvToArray(csv);
console.log(array);

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"
  }
]

Вы можете изменить приведенный выше код, чтобы разрешить различные и более сложные данные CSV.

Первоначально опубликовано на codingbeautydev.com

Все сумасшедшие вещи, которые делает JavaScript

Увлекательное руководство по тонким предостережениям и менее известным частям JavaScript.

Зарегистрируйтесь и немедленно получите бесплатную копию.