경로 표기 읽는 법
표의 각 줄에는 그 값에 닿는 경로가 함께 나옵니다. data.users[0].email은 최상위 객체의 data 키 안, users 배열의 첫 번째 항목의 email이라는 뜻입니다. 이 표기는 자바스크립트에서 값을 꺼내는 코드와 거의 그대로 대응하므로, 경로를 복사해 코드에 붙여 쓸 수 있습니다. 스키마 요약에서는 배열 번호를 []로 묶어 data.users[].email처럼 보여 주는데, 이는 "배열 안 모든 항목의 email"을 한 줄로 모은 것입니다. 몇 번째 항목이든 같은 자리이므로, 여기서 타입이 두 가지로 나오면 항목마다 값의 종류가 다르다는 신호입니다.
타입이 섞이면 무엇이 문제인가
예제 응답에서 첫 사용자의 id는 숫자 1이고 두 번째는 문자열 "2"입니다. JSON 자체는 이것을 허용하지만 받는 쪽 코드는 대개 한 가지를 가정합니다. 숫자로 비교하는 코드는 문자열 "2"에서 조용히 어긋나고, 타입스크립트 인터페이스를 자동 생성하면 number | string이라는 애매한 타입이 나옵니다. 마찬가지로 어떤 항목에만 age가 있고 다른 항목에는 없으면, 스키마 요약의 "횟수"가 다른 필드보다 적게 나옵니다. 전체 항목 수와 비교해 보면 그 필드가 선택 항목인지 아니면 누락인지 판단할 수 있습니다. 이 두 가지가 API 연동에서 가장 자주 만나는 함정입니다.
null과 빈 배열을 구분해야 하는 이유
null, [], "", 그리고 키 자체가 없는 것은 서로 다른 상태입니다. 대체로 null은 "값이 정해지지 않음", []는 "찾아봤지만 없음", 키 없음은 "이 응답에서는 해당 없음"에 가깝습니다. 화면에서는 셋 다 빈 자리로 보이지만 처리 코드는 달라야 합니다. 배열을 null로 내려보내는 API를 만나면 반복문 앞에서 반드시 확인해야 하고, 그렇지 않으면 실행 중 오류가 납니다. "null · 빈 값만 보기"를 켜면 이런 자리만 모아 볼 수 있어서, 연동 전에 어디를 방어해야 하는지 목록을 뽑기 좋습니다.
큰 응답을 다루는 요령
수천 개 항목이 들어 있는 목록 응답을 통째로 펼치면 표가 수만 줄이 되어 브라우저가 버거워집니다. 그래서 이 도구는 깊이 제한, 배열당 50개까지만 펼치기, 최대 표시 줄 수 세 가지로 양을 조절합니다. 실무에서 쓰기 좋은 순서는 이렇습니다. 먼저 깊이 2~3으로 전체 뼈대를 보고 어디에 무엇이 있는지 파악한 다음, 경로 검색에 관심 있는 키 이름을 넣어 그 부분만 펼칩니다. 스키마 요약은 표시 줄 수와 무관하게 전체를 훑어 만들기 때문에, 표가 잘려도 어떤 필드가 있는지는 요약에서 확인할 수 있습니다. 응답이 아주 크면 필요한 부분만 잘라 넣는 쪽이 빠릅니다.
자주 묻는 질문
중복된 키가 있는 JSON을 넣었는데 하나만 나옵니다.
JSON 파싱 단계에서 같은 키가 두 번 있으면 뒤의 값이 앞의 값을 덮어씁니다. 표준이 중복 키의 처리를 정해 두지 않아 브라우저는 이렇게 동작합니다. 원본에 중복이 있는지 확인하려면 원문 텍스트에서 직접 찾아보셔야 합니다.
큰 숫자가 조금 다르게 표시됩니다.
자바스크립트의 숫자는 안전한 정수 범위가 약 9007조까지라, 그보다 큰 ID를 숫자로 내려보내면 파싱 과정에서 끝자리가 바뀝니다. 이 문제를 피하려면 API 쪽에서 큰 ID를 문자열로 내려보내야 합니다. 표시가 이상하다면 원문에서 해당 값을 직접 확인하세요.
응답에 인증 토큰이 들어 있는데 넣어도 되나요?
파싱과 표 만들기가 전부 브라우저 안에서 실행되고 네트워크 요청을 만들지 않으므로 전송 위험은 없습니다. 다만 결과가 화면에 그대로 표시되므로 화면 공유나 녹화 중에는 주의하시고, 필요하면 해당 필드만 지운 뒤 넣으세요.