wecode 1주차 첫과제

백엔드 첫과제는 node의 fs모듈을 이용해서 csv파일을 읽고 그 읽어온 파일을
정해진 객체모양으로 데이터를 다시 담는거였다.

우선 첫번째로 태어나서 csv파일은 처음봤다. 그래서 이 과제를 해결하기 위해서는 csv파일이 어떤건지를 먼저 알아야 할것 같았다.
찾아보니

CSV(영어: comma-separated values)는 몇 가지 필드를 쉼표(,)로 구분한 텍스트 데이터 및 텍스트 파일이다. 확장자는 .csv이며 MIME 형식은 text/csv이다. comma-separated variables라고도 한다.

쉼표로 구분한 데이터및 텍스트 파일이라고 한다.
엑셀 파일을 ' , '로만 표현해서 나타낸 파일이라고 나는 이해했다.

그렇다면 첫번째 스텝은 해결했다.
그다음 문제는 csv 파일을 불러왔을때 나왔다.

로그 창을 보고나니 참 막막했다.
이거를 어떻게 객체로 key value 형태로 입력을 시킬지 도저히 아무 생각이 나지를 않았다.

그런데 아무리 생각해도 csv파일의 column과 row를 key value 형식으로 다시 담는 로직은 널리 알려져있을거 같았다.
그래서 구글링 해본 결과 내가 원하던 로직이 바로 나타났다.

  const rows = csv.split('\n');

줄바꿈 문자를 기준으로 배열을 split 하는것으로 시작한다. 이렇게 하고나면,

점점 정답에 가까워질수 있다는 희망이 보인다. 이렇게 각각의 배열로 나눴다면,

다음 로직이 진또배기다.

let results = [];
let columnTitle = [];
for (const i in rows) {
  const row = rows[i];
  const data = row.split(',');
  if (i === '0') {
    columnTitle = data;
  } else {
    let rowData = {};
    for (const index in columnTitle) {
      const title = columnTitle[index];
      rowData[title] = data[index];
    }
    results.push(rowData);
    console.log(results);
  }
}

한줄 한줄 이해를 해볼려 했다.

for (const i in rows) {
  const row = rows[i];
  const data = row.split(',');
  if (i === '0') {
    columnTitle = data;
  }

이 로직은 배열의 0번째 인덱스가 column이라는 점을 인지하고,
column배열을 따로 columnTitle이라는 변수에 할당해놓는다.
나중에 key로 변환시키기위해서

 else {
    let rowData = {};
    for (const index in columnTitle) {
      const title = columnTitle[index];
      rowData[title] = data[index];
    }
    results.push(rowData);

else 로직에서는 column배열을 제외하고 나머지 row가 되는 배열들과,
아까 따로 빼놓은 column배열을 가지고, key value 형태의 새로운 객체로 만들기 위한 작업이다. 이중for문 이해하듯이 이해하면 빠르게 이해할 수 있다.

이렇게 한 후 results값을 보면

드디어 해결했다.

이번 과제를 통해서 csv파일을 자바스크립트 객체 형태로 바꾸는 방법을 완벽하게 알수있고, 기본적인 자바스크립트 문법을 복습할 수 있어서,
너무 만족스러운 과제였다.