피드로 돌아가기
Dev.toFrontend
원문 읽기
Pure JS 기반 CSV-JSON 파서 설계 및 Edge Case 해결 전략
CSV to JSON: How to Convert Tabular Data in Pure JavaScript (No Libraries)
AI 요약
Context
외부 라이브러리 의존성 없이 브라우저 환경에서 Tabular 데이터를 구조화된 JSON으로 변환하는 요구사항 발생. 단순 split(',') 방식은 Quoted Field 내 쉼표 처리 불가 및 데이터 타입 손실이라는 한계를 가짐.
Technical Solution
- State Machine 기반의 parseCSVLine 구현을 통한 Quoted Field 내 구분자 무시 로직 적용
- 정규표현식 기반의 빈도수 분석을 통한 Delimiter 자동 감지 메커니즘 도입
- Number, Boolean, Null 타입을 판별하는 coerceValue 함수를 통한 Dynamic Type Casting 수행
- FileReader API 및 Blob Object 활용으로 서버 전송 없는 Client-side 전용 데이터 처리 파이프라인 구축
- .replace(/\r/g, '') 처리를 통한 OS별 Line Ending 호환성 확보
- lines.filter(Boolean) 적용으로 빈 행으로 인한 Empty Object 생성 방지
실천 포인트
- CSV 파싱 시 단순 split 대신 따옴표 상태를 추적하는 루프 기반 파서 검토 - 데이터 정밀도 확보를 위해 문자열 기반 CSV 값을 적절한 Primitive Type으로 변환하는 Coercion 로직 추가 - 10MB 이상의 대용량 파일 처리 시 Main Thread 차단 방지를 위한 Web Worker 도입 고려 - Excel CSV 특유의 BOM(Byte Order Mark) 문자로 인한 헤더 오염 여부 확인 및 제거