[자바스크립트] JSON to CSV 변환 출력 파싱 방법 (+JSON파일 읽기, CSV파일 쓰기 예제 코드 in node.js)

| Javascript: JSON 데이터를 CSV파일로 파싱하는 방법

별도 라이브러리 없이,

자바스크립트만으로 JSON을 CSV로 만드는 법을 정리합니다.

(node.js 및 브라우저 환경 모두에서 작동)

 

"아래의 jsonToCSV() 함수에 JSON형식의 배열객체를 넣어 호출하면 됩니다."

(JSON파일, CSV파일을 다루는 예제도 샘플코드로 작성해두었습니다.)

---

# JSON to CSV 함수 (JSON to CSV Converter)

: JSON형식의 배열객체를 넣어 호출하면, CSV 형식의 문자열(string)을 반환합니다.

: JSON형식의 문자열(string)을 넣어 호출할 경우엔, 함수의 1-1 코드 대신, 1-2 코드를 사용하면 됩니다.

function jsonToCSV(json_data) {

    // 1-1. json 데이터 취득
    const json_array = json_data;
    // 1-2. json데이터를 문자열(string)로 넣은 경우, JSON 배열 객체로 만들기 위해 아래 코드 사용
    // const json_array = JSON.parse(json_data);
    

    // 2. CSV 문자열 변수 선언: json을 csv로 변환한 문자열이 담길 변수
    let csv_string = '';


    // 3. 제목 추출: json_array의 첫번째 요소(객체)에서 제목(머릿글)으로 사용할 키값을 추출
    const titles = Object.keys(json_array[0]);

    
    // 4. CSV문자열에 제목 삽입: 각 제목은 컴마로 구분, 마지막 제목은 줄바꿈 추가
    titles.forEach((title, index)=>{
        csv_string += (index !== titles.length-1 ? `${title},` : `${title}\r\n`);
    });


    // 5. 내용 추출: json_array의 모든 요소를 순회하며 '내용' 추출
    json_array.forEach((content, index)=>{
        
        let row = ''; // 각 인덱스에 해당하는 '내용'을 담을 행

        for(let title in content){ // for in 문은 객체의 키값만 추출하여 순회함.
            // 행에 '내용' 할당: 각 내용 앞에 컴마를 삽입하여 구분, 첫번째 내용은 앞에 컴마X
            row += (row === '' ? `${content[title]}` : `,${content[title]}`);
        }

        // CSV 문자열에 '내용' 행 삽입: 뒤에 줄바꿈(\r\n) 추가, 마지막 행은 줄바꿈X
        csv_string += (index !== json_array.length-1 ? `${row}\r\n`: `${row}`);
    })

    // 6. CSV 문자열 반환: 최종 결과물(string)
    return csv_string;
}

 

 

주석으로 코드의 작동 원리를 상세하게 설명해 두었습니다.

 

코드에 사용된 반복문(forEach, Object.keys), 템플릿리터럴(`${}`), 삼항조건연산자는 각각 아래 글을 참고해보세요.

[자바스크립트] 반복문 총정리: for in, for of, forEach 등

[JS] 자바스크립트 템플릿 리터럴: 백틱(``), 달러(${ }) 사용법

[자바스크립트] 삼항 조건 연산자, 옵셔널체이닝 연산자, null병합 연산자: 변수, 객체, 값의 null 체크 검사 방법

 

실제 사용하는 방식은 아래 샘플 코드를 참고해 주시기 바랍니다.

(jsonToCSV 함수가 선언된 상태에서 사용해야 합니다.)

 

# JSON to CSV 샘플 예제 코드

1. 기본: "JSON배열객체 to CSV문자열" 변환 예제

가장 기본적인 사용법입니다. 함수에 JSON배열객체를 넣어 호출하면, CSV문자열이 튀어나옵니다.

// 1. json 배열 객체 생성
const json_data = [
    { '제품명': '대나무빨대', '가격': '2000', '갯수': '10' },
    { '제품명': '대나무석작', '가격': '10000', '갯수': '20' }
];


// 2. jsonToCSV 함수 호출: json을 csv로 변환
const csv_string = jsonToCSV(json_data);


// 3. 결과 확인
console.log(csv_string);

/* 출력결과
제품명,가격,갯수
대나무빨대,2000,10
대나무석작,10000,20
*/

 

2. 파일 읽기: "JSON파일 to CSV문자열" 예제 코드

node.js 환경에서 JSON파일을 읽어서 CSV로 변환하는 방법입니다.(파일을 읽을 때, node.js의 fs 모듈 사용)

// 1. node.js의 fs모듈 추출
const fs = require('fs');


// 2. xxx.json 파일 읽기
const json_file = fs.readFileSync('파일경로.json');


// 3. JSON 배열 객체로 변환
const json_data = JSON.parse(json_file.toString());


// 4. jsonToCSV함수 호출: json을 csv로 변환
const csv_string = jsonToCSV(json_data);


// 5. 결과 확인
console.log(csv_string);

/* 출력결과
제품명,가격,갯수
대나무빨대,2000,10
대나무석작,10000,20
*/

 

3. 파일 쓰기: "JSON배열객체 to CSV파일" 생성 예제

node.js환경에서 JSON배열객체를 CSV파일로 만드는 방법입니다.(파일 생성 시, node.js의 fs 모듈 사용)

// 1. node.js의 fs모듈 추출
const fs = require('fs');


// 2. json 배열객체 생성
const json_data = [
    { '제품명': '대나무빨대', '가격': '2000', '갯수': '10' },
    { '제품명': '대나무석작', '가격': '10000', '갯수': '20' }
];


// 3. jsonToCSV 함수 호출: json을 csv로 변환
const csv_string = jsonToCSV(json_data);


// 4. CSV 파일 생성
fs.writeFileSync('생성할파일경로.csv', csv_string);

 

<생성된 CSV파일을 excel이나 numbers에서 열어본 화면>

---

JSON to CSV 변환 출력 방법 정리 끝!

 

반대로 CSV를 JSON로 파싱하는 방법(CSV to JSON)은 아래글을 참고하시기 바랍니다.

[자바스크립트] CSV to JSON 변환 출력 방법+샘플예제코드(node.js 파일 처리 포함)