← 목록

JSON 데이터 다루기: 주니어 개발자를 위한 기본 가이드

작성: 2024년 07월 03일읽기: 약 2분

JSON(JavaScript Object Notation)은 데이터를 저장하고 교환하는 데 사용되는 경량의 데이터 포맷입니다. 웹 개발에서 JSON은 서버와 클라이언트 간에 데이터를 주고받을 때 매우 중요한 역할을 합니다. 이 가이드에서는 JSON 데이터를 다루는 기본적인 방법을 소개하겠습니다.

JSON 데이터란?

JSON 데이터는 이름과 값의 쌍으로 구성되어 있으며, 데이터는 쉼표로 구분됩니다. JSON 데이터는 중괄호 {}로 둘러싸여 객체를 나타내고, 대괄호 []는 배열을 나타냅니다.

예를 들어, 사용자 정보를 JSON 형식으로 표현하면 다음과 같습니다:

{
  "name": "John Doe",
  "age": 30,
  "isDeveloper": true,
  "skills": ["HTML", "CSS", "JavaScript"]
}

JSON 데이터 읽기

JavaScript에서 JSON 데이터를 다루기 위해 JSON.parse() 함수를 사용할 수 있습니다. 이 함수는 JSON 문자열을 JavaScript 객체로 변환합니다.

const jsonString = '{"name": "John Doe", "age": 30, "isDeveloper": true, "skills": ["HTML", "CSS", "JavaScript"]}';

const user = JSON.parse(jsonString);

console.log(user.name); // 출력: John Doe

JSON 데이터 쓰기

반대로, JavaScript 객체를 JSON 문자열로 변환하려면 JSON.stringify() 함수를 사용합니다. 이는 서버로 데이터를 전송할 때 유용합니다.

const user = {
  name: "John Doe",
  age: 30,
  isDeveloper: true,
  skills: ["HTML", "CSS", "JavaScript"]
};

const jsonString = JSON.stringify(user);

console.log(jsonString);
// 출력: {"name":"John Doe","age":30,"isDeveloper":true,"skills":["HTML","CSS","JavaScript"]}

실습해보기

이제 여러분 차례입니다. 다음 데이터를 JSON 문자열로 변환해 보세요:

  1. 이름이 "Jane Doe"이고, 나이가 25살인 사용자의 정보
  2. 사용자가 개발자이며, "Python"과 "Django" 기술을 가지고 있음
const userInfo = {
  name: "Jane Doe",
  age: 25,
  isDeveloper: true,
  skills: ["Python", "Django"]
};

const jsonString = JSON.stringify(userInfo);

console.log(jsonString);

JSON 데이터를 다루는 것은 웹 개발의 기본이며, 이를 통해 서버와 클라이언트 간의 통신을 더 효율적으로 만들 수 있습니다. 이 가이드가 JSON에 대한 이해를 돕는 데 도움이 되었기를 바랍니다.