패스트캠퍼스 환급챌린지 39일차 : 김민태의 프론트엔드 아카데미 : 제 1강 JavaScript & TypeScript Essential 강의 후기

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
https://fastcampus.info/4n8ztzq

250808(금) 39일차

문법 - JSON

 

객체는 메모리에, JSON은 데이터에
JavaScript의 객체는 런타임 동안 메모리에만 존재하지만 
서버나 DB, 로컬 스토리지에 저장하거나 다른 시스템과 데이터를 주고받을 때는 문자열 형태의 데이터가 필요하므로
이때 사용되는 포맷이 바로 JSON

 

JSON은 객체처럼 보이지만 더 엄격하다
JSON은 객체와 비슷한 문법을 가지고 있지만 아래와 같은 명확한 규칙이 존재
- 키는 반드시 **더블 쿼트(")**로 감싸야 함
- 값이 문자열일 경우에도 더블 쿼트만 허용 (싱글 쿼트 x)
- 함수는 허용되지 않음
- 꼬리 콤마(,) 금지

{
  "name": "Kim",
  "age": 30,
  "bloodType": "B"
}

이러한 제약은 JSON이 데이터 교환용 포맷이기 때문에 엄격한 규칙으로 신뢰성 있는 전달을 보장하기 위함

 

객체 ↔ JSON 변환은 단 한 줄로
문자열 → 객체: JSON.parse()
객체 → 문자열: JSON.stringify()

const jsonString = '{"name":"Kim"}';
const obj = JSON.parse(jsonString);
console.log(obj.name); // "Kim"

const json = JSON.stringify({ name: "Kim" });
console.log(json); // "{"name":"Kim"}"

이러한 변환을 통해 서버와 데이터 송수신, 스토리지 저장, API 요청/응답 처리 등 다양한 실무 영역에 활용할 수 있음

 

JSON.parse는 예외를 발생시킴

try {
  const parsed = JSON.parse('{"name": "Kim"}'); // 정상
} catch (e) {
  console.error("파싱 실패 – 다시 시도해주세요.");
}

문법 오류가 있는 JSON 문자열은 JSON.parse()에서 예외를 던지며 실행을 중단시키므로
네트워크 요청이나 저장소에서 받아온 JSON 데이터를 사용할 땐 반드시 try-catch로 감싸는 습관이 중요

 

이번 강의를 통해 JavaScript 객체와 JSON의 차이점과 실제 데이터 송수신을 위한 JSON의 역할을 체계적으로 이해할 수 있었다
특히 JSON이 단순한 포맷이 아니라 데이터를 안전하게 주고받기 위한 표준 구조라는 점에서 중요성을 새삼 느끼게 해준 강의