CSV 파일을 JSON으로 만들어서 활용하기

개요

사내에서 진행 중인 프로젝트에 CSV 파일을 읽어들여서 데이터를 변환하는 프로그램을 제작 중이다. CSV 파일 내용을 가져와서 변환된 모습을 보여주어야 하기 때문에 내가 가장 보편적으로 다루는 형태로 내용을 가지고 있어야만 했다.

가장 많이 쓰는 형태, JSON

프로젝트를 하면서 가장 많이 쓰이는 데이터 형태가 어떤 형태일지 생각해보니, 객체 형태라는 것이 가장 많이 떠올랐다. 서버로 부터 데이터를 받았을 때도, 혹은 여러 정보를 하나의 객체로 표현할 때도 JSON 모양으로 받아오는 경우가 가장 많았고 이를 사용하기로 했다.

 

어떤 것을 고려해야할까?

해당 파일의 샘플은 아래와 같다.

 

이 파일의 내용을 문자열 형태로 받을 것이다.

 

아직 진짜 파일 업로드 기능을 구현한 것은 아니기에, 파일을 받았다는 가정하에 하나의 함수로 만들어야겠다고 생각했다.

파일의 정보를 긁어와 하나의 변수에 담고 이를 매개변수로 형태로 받도록 해주었다.

 

function csvToJSON(csv_string) {
  
  return;
}

 

함수 이름은 가독성을 위해 csvToJSON이라는 이름으로 지어줬고, 매개변수도 csv_string이라고 지어줬다.

 

우선 전체적인 걸 정리해보자면 아래와 같다.

1. 데이터를 받게 되면 각 행은 줄바꿈을 통해서 구분이 될 것이다.
2. 맨 윗줄을 key 프로퍼티값으로 잡고, 행을 객체 형태로 만들어준다.
3. 객체 형태로 만들어진 것을 배열에 넣고
4. 나머지 내용행을 객체로 만들어 value 프로퍼티에 추가한다.
5. 그 객체를 다시 배열에 추가하면 끝

그럼 이제 시작해보도록 하자.

 

함수 만들기

문자열을 줄바꿈으로 구분한 뒤 배열에 저장하기

function csvToJSON(csv_string) {
  const rows = csv_string.split('\r\n');

  return ;
}

 

이때, 줄바꿈 방식은 운영체제마다 조금씩 차이가 있다.

• Windows : CR+LF(\r\n)
• Unix 계열 : LF(\n)
• Mac - Mac OS X 버전 CR(\r), 이후 Macintosh LF(\n)을 줄 바꿈 문자로 채택하여 사용

나는 윈도우를 사용하고 있기 때문에 \r\n을 사용하였다.

 

CSV의 각 행을 담을 JSON 객체, 빈 배열 생성하기

function csvToJSON(csv_string) {
  const rows = csv_string.split('\r\n');

  const jsonArray = [];

  return;
}

 

제목 행 추출(맨 윗줄) 후 콤마로 구분해 배열에 저장하기

function csvToJSON(csv_string) {
  const rows = csv_string.split('\r\n');

  const jsonArray = [];

  const header = rows[0].split(',');

  return;
}

 

 

아까 봤던 데이터 파일 이다. seq, device_id, .. 이 부분을 추출할 것이다. 만약 제목행을 추출하지 않고 진행하면 1번라인이 키값으로 잡히게 되고 원하는 형태의 파일로 나탤 수 없다.

 

내용 행 전체를 객체로 만들어 jsonArray에 담기

function csvToJSON(csv_string) {
  const rows = csv_string.split('\r\n');

  const jsonArray = [];

  const header = rows[0].split(',');

  for (let i = 1; i < rows.length; i++) {
    // 빈 객체 생성: 각 내용 행을 객체로 만들어 담아둘 객체임
    let obj = {};

    // 각 내용 행을 콤마로 구분
    let row = rows[i].replace(/(\s*)/g, '').split(',');

    // 각 내용행을 {제목1:내용1, 제목2:내용2, ...} 형태의 객체로 생성
    for (let j = 0; j < header.length; j++) {
      obj[header[j]] = row[j];
    }

    // 각 내용 행의 객체를 jsonArray배열에 담기
    jsonArray.push(obj);
  }

  return;
}

 

각 내용 행을 객체로 만들어서 제목1:내용1 형태로 만들어주었다. 

완성된 JSON형태의 객체 배열 반환

function csvToJSON(csv_string) {
  const rows = csv_string.split('\r\n');

  const jsonArray = [];

  const header = rows[0].split(',');

  for (let i = 1; i < rows.length; i++) {
    // 빈 객체 생성: 각 내용 행을 객체로 만들어 담아둘 객체임
    let obj = {};

    // 각 내용 행을 콤마로 구분
    let row = rows[i].replace(/(\s*)/g, '').split(',');

    // 각 내용행을 {제목1:내용1, 제목2:내용2, ...} 형태의 객체로 생성
    for (let j = 0; j < header.length; j++) {
      obj[header[j]] = row[j];
    }

    // 각 내용 행의 객체를 jsonArray배열에 담기
    jsonArray.push(obj);
  }

  return jsonArray;
}

 

결과

csv 파일 내용을 문자열로 만들어 함수에 넣어보았다. 그리고 그 결과는 아래와 같았다.

0번째 인덱스에 각 제목과 내용이 객체형태로 들어갔다.