다다의 개발일지 6v6

데이터 교환에 많이 사용되는 JSON 형식에 대해서 알아보자 본문

Frontend/JavaScript

데이터 교환에 많이 사용되는 JSON 형식에 대해서 알아보자

dev6v6 2025. 2. 24. 14:00

JSON (JavaScript Object Notation) 이란?

JSON은 JavaScript 객체 표기법을 기반으로 만든 데이터 형식.
사람이 읽기 쉽고, 기계가 해석하기 쉬운 구조로 되어 있어서, 서버와 클라이언트 간 데이터 교환에 가장 많이 사용된다.

 

 

JSON은 key-value(키-값) 쌍으로 이루어져 있다.

JSON은 자료형 리스트와 딕셔너리를 섞어놓은 것처럼 생겼음

 

📌 JSON 데이터 예시 (문자열 형태로 저장됨)

{
  "name": "Alice",
  "age": 25,
  "isStudent": false,
  "skills": ["JavaScript", "Python", "Java"],
  "address": {
    "city": "Seoul",
    "country": "Korea"
  }
}

 

JSON의 특징 (JavaScript 객체와 비교)

  JSON JavaScript 객체
문자열 속성 (Key) 반드시 "" (큰따옴표) 사용 따옴표 없이 가능
데이터 타입 문자열, 숫자, 불리언, 배열, 객체 가능 함수, undefined 사용 가능
사용 목적 데이터 저장/전송 로직 처리 및 데이터 조작

JSON은 반드시 key를 큰따옴표("")로 감싸야 한다!

{ "name": "Alice" } ✅ (JSON 형식)
{ name: "Alice" } ❌ (JavaScript 객체, JSON 아님!)

 

JSON을 JavaScript에서 다루는 방법

JavaScript에서 JSON을 사용하려면 문자열 → 객체,  객체 → 문자열 변환이 필요.

 

✔ JSON을 객체로 변환 (파싱)

📌 JSON 문자열을 JavaScript 객체로 변환할 때 JSON.parse()를 사용!

const jsonData = '{"name": "Alice", "age": 25}';
const obj = JSON.parse(jsonData);
console.log(obj.name); // "Alice"
console.log(obj.age);  // 25

 

✔ 객체를 JSON 문자열로 변환

📌 JavaScript 객체를 JSON 형식의 문자열로 변환할 때 JSON.stringify()를 사용!

const person = {
  name: "Bob",
  age: 30,
  isStudent: false
};
const jsonString = JSON.stringify(person);
console.log(jsonString); 
// '{"name":"Bob","age":30,"isStudent":false}'

 

JSON이 많이 사용되는 곳

 

 API 응답 및 요청 (서버와 데이터 주고받을 때)
 로컬 저장소 (localStorage, sessionStorage) 저장
 설정 파일 (config.json)
 데이터베이스에서 데이터 주고받을 때 (MongoDB 등)

 

 

 JSON은 데이터를 저장하고 주고받는 형식으로, JavaScript 객체와 유사하지만 문자열 형태로 다룸!
 서버와 클라이언트 간 데이터를 주고받을 때 가장 많이 사용됨!
 JSON.parse() → JSON을 객체로 변환
 JSON.stringify() → 객체를 JSON으로 변환