[JavaScript] 객체(Object)와 JSON 사용법 및 차이점 정리하기

JavaScript에서 객체(Object)와 JSON은 자주 사용되는 데이터 구조입니다. 두 가지 모두 데이터를 저장하고 다룰 수 있지만, 사용 목적과 방법에는 차이가 있습니다. 특히 초보자들이 JSON과 객체를 혼동하는 경우가 많습니다. 이번 포스팅에서는 JavaScript에서 객체와 JSON의 개념, 사용법, 그리고 차이점을 예제와 함께 자세히 설명하겠습니다.

객체(Object)와 JSON 사용법 및 차이점 정리하기

---

1. 객체(Object)란 무엇인가?

1) 객체(Object)의 정의

• 객체는 키(Key)와 값(Value) 쌍으로 구성된 데이터 구조입니다.
• 변수나 함수 등을 그룹으로 묶어서 관리할 수 있습니다.

2) 객체 생성 방법

// 방법 1: 객체 리터럴
const person = {
    name: 'Alice',
    age: 30,
    greet: function() {
        console.log('Hello!');
    }
};

// 방법 2: 생성자 함수
function Person(name, age) {
    this.name = name;
    this.age = age;
}
const bob = new Person('Bob', 25);

3) 객체의 주요 기능

• 속성 접근 및 수정:

console.log(person.name);  // 출력: Alice
person.age = 31;

• 메서드 호출:

person.greet();  // 출력: Hello!

---

2. JSON(JavaScript Object Notation)이란?

1) JSON의 정의

• JSON은 데이터를 구조화하여 저장하거나 전송하기 위해 사용하는 텍스트 기반 데이터 형식입니다.
• 객체와 비슷하게 키-값 쌍으로 구성되지만, 문자열로 표현됩니다.

2) JSON 예제

{
    "name": "Alice",
    "age": 30,
    "city": "Seoul"
}

3) JSON의 사용 목적

• 서버와 클라이언트 간의 데이터 교환에 사용됩니다.
• 대부분의 프로그래밍 언어에서 쉽게 파싱하고 생성할 수 있습니다.

---

3. 객체와 JSON의 차이점

구분	객체 (Object)	JSON
데이터 형식	Key-Value 쌍 (문자열, 숫자, 함수 포함 가능)	Key-Value 쌍 (문자열로 표현)
사용 목적	JavaScript 코드 내에서 데이터 관리 및 조작	데이터 전송 및 저장
데이터 접근	점(.) 또는 대괄호([]) 표기법 사용	파싱(JSON.parse()) 필요
메서드 포함	가능	불가능

예제: 객체와 JSON 비교

// 객체
const user = {
    name: 'Charlie',
    greet() {
        console.log('Hello, ' + this.name);
    }
};
user.greet();  // 출력: Hello, Charlie

// JSON
const userJSON = '{"name": "Charlie"}';
const parsedUser = JSON.parse(userJSON);
console.log(parsedUser.name);  // 출력: Charlie

---

4. JSON 사용법

1) JSON 문자열을 객체로 변환하기 (JSON.parse())

const jsonString = '{"name": "Alice", "age": 30}';
const user = JSON.parse(jsonString);
console.log(user.name);  // 출력: Alice

2) 객체를 JSON 문자열로 변환하기 (JSON.stringify())

const user = {
    name: 'Bob',
    age: 25
};
const jsonString = JSON.stringify(user);
console.log(jsonString);  // 출력: {"name":"Bob","age":25}

3) JSON 사용 시 주의사항

• JSON은 함수, undefined, Symbol 값을 포함할 수 없습니다.
• 키는 반드시 문자열이어야 합니다.

(이미지 필요: JSON.parse()와 JSON.stringify()의 변환 과정 다이어그램)

---

5. 추가 팁 및 참고 사항

• JSON을 안전하게 다루기 위해 항상 try...catch로 오류를 처리하는 것이 좋습니다.

try {
    const data = JSON.parse(invalidJson);
} catch (error) {
    console.error('JSON 파싱 오류:', error.message);
}

• API 통신 시 JSON 형식의 데이터를 주고받는 경우가 많습니다.

---

6. 요약 및 마무리

이번 포스팅에서는 JavaScript의 객체(Object)와 JSON의 차이점을 비교하고, 각각의 사용법을 설명했습니다. 객체는 JavaScript 코드 내에서 데이터를 다루기 위한 구조이며, JSON은 데이터를 문자열로 표현하여 전송하거나 저장할 때 사용합니다. 객체와 JSON의 차이점을 잘 이해하고, 상황에 맞게 적절히 사용하세요.

---

7. 관련 글 링크

• 관련 글: JavaScript의 배열(Array) 메서드 총정리