JSON null 값 제거, 뭐가 남고 뭐가 지워지나

API 응답이나 설정 파일에 섞여 있는 null, 빈 문자열(""), 빈 배열([]), 빈 객체({})를 한 번에 걸러내려면 결국 하나의 판정 규칙만 알면 됩니다. 어떤 값을 "비어 있다"로 볼지, 그리고 그 판정이 안쪽 값부터 바깥쪽 순서로 적용된다는 점입니다. 이 글은 그 규칙을 코드 기준으로 그대로 설명합니다.

요약 ① 빈 문자열, null, undefined, 빈 배열, 빈 객체만 제거되고 0과 false, 비어 있지 않은 문자열은 그대로 남습니다. ② 자식 값부터 정리한 뒤 부모를 판정하므로, 중첩 객체가 비게 되면 상위 레벨에서도 함께 삭제됩니다. ③ 표준 JSON.parse를 쓰기 때문에 트레일링 콤마·따옴표 없는 키·리터럴 undefined가 있으면 처리 자체가 거부됩니다.

왜 이런 정리가 필요해지나

API 응답 JSON을 파일로 저장해 다음 실행에 재사용하거나, 여러 요청 결과를 모아 로그로 남기는 경우가 있습니다. 이때 선택 필드가 비어 있으면 응답에는 그 자리에 null이나 빈 문자열, 빈 배열이 그대로 채워져 내려옵니다.

파일이 쌓일수록 실제 값이 있는 키보다 비어 있는 키가 더 많아지기도 합니다. 이런 파일을 diff로 비교하거나 눈으로 훑어볼 때, 빈 값이 화면을 채우고 있으면 정작 봐야 할 값을 찾기 어려워집니다.

문제는 빈 값이 최상위에만 있지 않다는 점입니다. 중첩된 객체 안, 배열 안의 객체 안에 또 중첩되어 있는 경우가 흔해서, 한 단계씩 손으로 지우다 보면 빠뜨리는 지점이 생기고 구조가 망가지기 쉽습니다.

도구 없이 직접 정리하는 방법

이 정리 규칙은 특별한 게 아니라 재귀 함수 하나로 표현할 수 있습니다. 브라우저 개발자 도구의 콘솔에 그대로 붙여 넣으면 도구 없이도 같은 결과를 얻을 수 있습니다.

function isEmpty(v) {
  if (v === "" || v === null || v === undefined) return true;
  if (Array.isArray(v) && v.length === 0) return true;
  if (v && typeof v === "object" && Object.keys(v).length === 0) return true;
  return false;
}

function cleanValues(value) {
  if (Array.isArray(value)) {
    return value.map(cleanValues).filter((v) => !isEmpty(v));
  }
  if (value !== null && typeof value === "object") {
    const result = {};
    for (const [key, val] of Object.entries(value)) {
      const cleaned = cleanValues(val);
      if (!isEmpty(cleaned)) result[key] = cleaned;
    }
    return result;
  }
  return value;
}

const data = JSON.parse(원본_JSON_문자열);
console.log(JSON.stringify(cleanValues(data), null, 2));

순서만 정리하면 이렇습니다.

1. 원본 JSON 문자열을 JSON.parse로 파싱합니다. 문법이 틀리면 이 단계에서 에러가 나므로, 먼저 문법 오류가 없는지부터 확인해야 합니다.
2. 배열이면 각 항목을 먼저 재귀적으로 정리한 뒤, 정리된 결과가 빈 문자열·null·undefined·빈 배열·빈 객체인 항목만 걸러냅니다.
3. 객체면 각 속성 값을 먼저 재귀적으로 정리한 뒤, 정리된 값이 같은 기준으로 비어 있으면 그 키 자체를 결과 객체에서 뺍니다.
4. 배열도 객체도 아닌 값(문자열, 숫자, 불리언)은 그대로 통과시킵니다. 0과 false는 이 판정 기준 어디에도 해당하지 않으므로 그대로 남습니다.

저희 도구로 확인하기.

직접 해보기 →

흔히 헷갈리는 부분

판정 기준은 막연히 "비어 보이는 값"이 아니라, 정확히 정해진 목록에 해당하는 값만 제거 대상이 됩니다. 아래 표로 정리했습니다.

0과 false가 남는 이유는 판정 함수가 정확히 "", null, undefined, 빈 배열, 빈 객체 다섯 가지와만 값을 비교하기 때문입니다. 0과 false는 이 다섯 가지 어디에도 속하지 않으므로 판정을 그대로 통과합니다.

공백 한 칸(" ")도 마찬가지입니다. 빈 문자열("")과 문자 하나가 들어 있는 문자열은 다른 값이므로, 공백만 있는 문자열은 제거되지 않고 그대로 남습니다.

출력이 아예 나오지 않고 빨간 에러 메시지만 뜨는 경우는 정리 규칙과는 무관하게, 입력 자체가 유효한 JSON 문법이 아닐 때입니다. 흔한 원인은 다음과 같습니다.

• 마지막 항목 뒤에 콤마가 남아 있는 경우 (트레일링 콤마): {"a": 1,}
• 키를 따옴표로 감싸지 않은 경우: {a: 1}
• 값으로 undefined 리터럴을 직접 쓴 경우: {"a": undefined} — JSON에는 undefined라는 값 자체가 없고 null만 유효합니다
• 문자열이나 키를 작은따옴표로 감싼 경우: {'a': 'b'}

JSON.parse는 자바스크립트 객체 리터럴보다 엄격한 표준입니다. 이 중 하나라도 섞여 있으면 파싱 단계에서 멈추고 에러가 뜨며, 빈 값을 걸러내는 로직 자체가 실행되지 않습니다.

정리

• 제거 대상은 정확히 다섯 가지입니다. 빈 문자열, null, undefined, 빈 배열, 빈 객체입니다.
• 0, false, 공백을 포함한 비어 있지 않은 문자열·배열·객체는 그대로 남습니다.
• 정리는 자식 값부터 부모 순서로 진행되므로, 자식이 비워져 부모가 빈 객체가 되면 부모도 다음 단계에서 함께 제거됩니다.
• 입력은 표준 JSON.parse로 검증되므로, 트레일링 콤마·따옴표 없는 키·undefined 리터럴이 있으면 정리에 앞서 에러가 뜹니다.

자주 묻는 질문

값이 0이거나 false인 항목도 지워지나요?

아니요. 판정 함수는 "", null, undefined, 빈 배열, 빈 객체 다섯 가지만 제거 대상으로 봅니다. 0과 false는 이 목록에 없으므로 그대로 유지됩니다.

여러 단계로 중첩된 객체 안의 빈 값도 제거되나요?

네. 정리는 배열이든 객체든 가장 안쪽 값부터 먼저 처리한 뒤 바깥쪽으로 올라오는 방식입니다. 중첩된 객체의 모든 속성이 정리 과정에서 비워지면 그 객체 자체가 빈 객체({})가 되고, 한 단계 위에서 다시 제거 대상이 됩니다. 이 과정은 배열이나 객체가 몇 겹으로 중첩되어 있어도 동일하게 반복됩니다.

왜 "Invalid JSON" 같은 에러가 뜨고 결과가 안 나오나요?

빈 값 정리 로직보다 먼저 입력을 표준 JSON.parse로 파싱하는 단계가 있기 때문입니다. 트레일링 콤마, 따옴표 없는 키, undefined 리터럴처럼 JSON 문법에 없는 표현이 섞여 있으면 이 단계에서 실패해 에러 메시지만 표시되고, 빈 값 정리는 아예 실행되지 않습니다.

배열 안에 있는 0이나 빈 문자열은 어떻게 처리되나요?

배열의 각 항목도 객체 속성과 같은 기준으로 판정됩니다. 항목이 빈 문자열이면 배열에서 빠지고, 0이면 값이 있는 항목으로 보고 그대로 남습니다. 배열 자체가 항목을 모두 걸러낸 뒤 비게 되면, 그 배열을 담고 있던 상위 키도 다음 단계에서 제거됩니다.