📚 JavaScript의 객체 표기법과 JSON 문법의 미세한 차이 이해하기
자바스크립트의 객체 및 배열 표현 방식과 JSON 형식 간의 미묘한 차이점이 존재하는데, 많은 개발자들이 이 두 가지를 혼동하는 경우가 많다.
그래서, 이번 글을 통해 JSON에 대해 간단히 알아보고, JavaScript의 객체 표기법과 JSON 문법의 차이점에 대해 다뤄보고자 한다.
JSON이란
📌 JSON약자 및 포맷
JSON은 JavaScript Object Notation의 줄임말로, 어떤 정보를 교환할 때 사용하기 위해서 만들어진 데이터 포맷으로 자바스크립트 언어의 문법을 빌려서 만들어진 데이터 포맷이다.
📌 Json의 Data Type
JSON은 기본적으로 String타입이다. 따라서, 자바스크립트에서 객체처럼 사용하기 위해서는 자바스크립트 객체로 변환해줘야 한다. 그래야, 해당 객체의 내용을 간편하게 사용하고 처리할 수 있기 때문이다.
이 때, 자바스크립트의 기본 내장 객체인 JSON 객체의 parse 메소드를 사용해 변환 가능하다.
const users = JSON.parse(userData)JavaScript의 객체 표기법과 JSON 문법의 차이점
📌 Property 이름과 값의 표현 방식 차이
자바스크립트에서 객체 리터럴 표현은 상당히 유연하다. 프로퍼티 이름에 큰따옴표를 사용하지 않아도 되고, 문자열 값에는 큰따옴표 또는 작은따옴표를 사용할 수 있다.
반면 JSON 형식에서는 이러한 유연성이 제한된다. 차이점으로, 프로퍼티 이름은 반드시 큰따옴표로 감싸야 하며, 문자열 값도 큰따옴표를 사용해야 한다.
// javascript
const member = {
name: 'Michael Kim',
height: 180,
weight: 70,
hobbies: ['Basketball', 'Listening to music']
};// json (cf> 실제로는 주석 사용 불가)
{
"name": "Michael Kim",
"height": 180,
"weight": 70,
"hobbies": ["Basketball", "Listening to music"]
}📌 표현할 수 없는 값들
자바스크립트는 undefined, NaN, Infinity와 같은 특별한 값들을 프로퍼티 값으로 사용할 수 있지만, JSON에서는 이를 표현할 수 없다.
JSON의 목적은 언어와 환경에 종속되지 않는 범용적인 데이터 포맷이 되는 것이므로, 특정 언어에만 존재하는 개념들은 배제된다.
📌 주석 사용 가능의 유무
JSON은 데이터 포맷이기 때문에, 주석을 추가할 수 없다. 이는 JSON을 코드가 아닌 순수한 데이터로써 사용하기 위한 설계 결정 때문이라고 하니 참고하면 좋을 것 같다.
Json 포맷에 관한 내용: https://www.json.org/json-en.html
Outro
자바스크립트 객체 리터럴과 JSON 형식은 유사해 보이지만, 위에서 언급한 것처럼 미세한 차이점들이 존재하니, 이러한 차이점들을 잘 이해하고 있어야 한다. 특히 데이터를 주고받는 웹 개발 환경에서 JSON 형식의 정확한 이해는 더더욱 중요하니, 이에 대해 명확히 숙지하고 JSON을 올바르게 활용하자.
