JSON은 JavaScript Object Notation의 약자로, 데이터를 주고받기 위한 경량의 데이터 형식입니다. 자바스크립트에서 JSON을 사용하여 사용자 정보를 저장하고 관리하는 방법을 알아보겠습니다.

1. JSON 형식 이해하기

JSON은 키-값 쌍으로 이루어진 데이터 객체의 형식입니다. 각 키는 문자열로 표현되고 쌍따옴표로 묶여야 합니다. 값은 문자열, 숫자, 불리언, 객체, 배열, null 등 다양한 데이터 타입이 될 수 있습니다. JSON은 중괄호 {}로 객체를 표현하며, 배열은 대괄호 []로 표현됩니다.

예를 들어, 사용자 정보를 JSON으로 표현하려면 다음과 같은 형식을 따라야 합니다:

{
  "name": "John",
  "age": 25,
  "email": "john@example.com"
}

2. 사용자 정보를 JSON으로 저장하기

자바스크립트에서는 JSON.stringify() 메소드를 사용하여 JavaScript 객체를 JSON 형식의 문자열로 변환할 수 있습니다. 이를 활용하여 사용자 정보를 JSON 형식으로 저장할 수 있습니다.

예를 들어, 다음과 같은 사용자 정보 객체가 있다고 가정해 봅시다:

const user = {
  name: "John",
  age: 25,
  email: "john@example.com"
};

이 객체를 JSON 형식으로 변환하려면 다음과 같이 코드를 작성할 수 있습니다:

const jsonUser = JSON.stringify(user);
console.log(jsonUser);

위 코드를 실행하면 다음과 같은 JSON 문자열이 출력됩니다:

{
  "name": "John",
  "age": 25,
  "email": "john@example.com"
}

3. JSON 문자열을 사용자 정보로 변환하기

반대로, JSON 문자열을 JavaScript 객체로 변환하려면 JSON.parse() 메소드를 사용합니다. 이를 활용하여 저장된 사용자 정보를 다시 JavaScript 객체로 변환할 수 있습니다.

예를 들어, 다음과 같은 JSON 문자열을 가정해 봅시다:

{
  "name": "Jane",
  "age": 30,
  "email": "jane@example.com"
}

이 JSON 문자열을 JavaScript 객체로 변환하려면 다음과 같이 코드를 작성할 수 있습니다:

const jsonString = '{"name":"Jane","age":30,"email":"jane@example.com"}';
const user = JSON.parse(jsonString);
console.log(user.name); // 출력: "Jane"

위 코드를 실행하면 JavaScript 객체로 변환된 사용자 정보를 활용하여 특정 속성에 접근할 수 있습니다.

4. 사용자 정보 저장과 관리 예제

자바스크립트에서 JSON을 사용하여 사용자 정보를 저장하고 관리하는 예제를 살펴보겠습니다. 이 예제에서는 사용자를 추가하고, 저장된 사용자 정보를 확인 및 수정하는 기능을 구현합니다.

let users = []; // 사용자 정보 배열

// 사용자 추가 함수
function addUser(name, age, email) {
  const newUser = {
    name: name,
    age: age,
    email: email
  };
  users.push(newUser);
}

// 사용자 정보 확인 함수
function getUser(index) {
  return users[index];
}

// 사용자 정보 수정 함수
function updateUser(index, name, age, email) {
  users[index].name = name;
  users[index].age = age;
  users[index].email = email;
}

// 사용자 추가
addUser("John", 25, "john@example.com");
addUser("Jane", 30, "jane@example.com");

// 사용자 정보 출력
console.log(users);

// 특정 사용자 정보 확인
const user = getUser(0);
console.log(user.name); // 출력: "John"

// 사용자 정보 수정
updateUser(0, "Jack", 26, "jack@example.com");
console.log(users);

위 예제에서는 users 변수를 사용하여 사용자를 저장하고 관리합니다. addUser() 함수를 통해 사용자를 추가하고, getUser() 함수를 통해 특정 인덱스의 사용자 정보를 확인하며, updateUser() 함수를 통해 특정 사용자의 정보를 수정합니다.

JSON을 사용하여 사용자 정보를 저장하고 관리함으로써 데이터를 효율적으로 처리하고, 웹 애플리케이션 또는 API와의 데이터 교환 등에 유용하게 활용할 수 있습니다.